Bug: Should function isControlled use !== ?

React version: 16.20.0

Steps To Reproduce

1. inital state is undefined , the useAsyncCustomHooks will call an async function eg: navigator.geolocation.getCurrentPosition
2. the state will changed later

Link to code example:

  function FC() {
    const [state] = useAsyncCustomHooks()
    return <input  type="text" value={state}/>
  }

The current behavior

dev tool throws Warning: A component is changing a controlled input of type hidden to be uncontrolled. Input elements should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://fb.me/react-controlled-components

The expected behavior

Not throw that warning, the related source code is: https://github.com/facebook/react/blob/c601f7a64640290af85c9f0e33c78480656b46bc/packages/react-dom/src/client/ReactDOMFiberInput.js#L37-L40

why not !== but != 😊

[sophiebits]

Many applications rely on a value of undefined to mean an uncontrolled component. If you want to treat undefined to mean a controlled empty box, you can always write something like:

<input type="text" value={state === undefined ? '' : state} />

Hope that helps.

[xsteadybcgo]

Thanks for your reminder, I get it