form-atoms / form-atoms

Atomic form primitives for Jotai

Home Page:https://codesandbox.io/s/getting-started-with-form-atoms-v2-ddhgq2?file=/src/App.tsx

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Bug - the `useField` reads value before initialization

MiroslavPetrik opened this issue ยท comments

Describe the bug
the first render with useField() does not use the value supplied in the initialValue option.

To Reproduce

  const field = fieldAtom<string>({ value: "" });

    const FirstValueProp = () => {
      const {
        state: { value },
      } = useField(field, { initialValue: "test" });
      const [firstValueProp] = useState(() => value);

      return <input value={firstValueProp} placeholder={value} />;
    };

    render(<FirstValueProp />);

the input placeholder will have the value "test", while the input value will have value "" from the first render.

Expected behavior
the value and placeholder should have the same value.

Screenshots
image

Additional context

  • This is problematic, when the value is forwarded to some uncontrolled components, which will be incorrectly initialized.

๐ŸŽ‰ This issue has been resolved in version 3.2.5 ๐ŸŽ‰

The release is available on:

Your semantic-release bot ๐Ÿ“ฆ๐Ÿš€