React: [Feature Request]: input#value bindings with useState

[tomitheninja]

Hey!

I noticed, many of the popular javascript frameworks support binding a value to a HTMLInputElement.

I think, with the new useState syntax, it became possible to implement this in react with a nice syntax and no breaking changes.

In expressjs the request object also contains the response object. Something like this could be used to create this functionality. If setValue were also an array containing [value, setValue], then it could then be consumed by a bindable component.

function MyComponent() {
  const state = useState('')
  const [value, setValue] = state
  return (
    <input bind={setValue} />
    // ...
  )
}

function input({bind}) {
  const [value, setValue] = bind
  /// ...
}

Or useState could return [value, setValue, bind]

[dmytro-lymarenko]

You can do either like this:

function MyComponent() {
  const bind = useState('')
  // destructure for some other purpose in MyComponent
  const [value, setValue] = bind
  return (
    <input bind={bind} />
    // ...
  )
}

function input({bind}) {
  const [value, setValue] = bind
  /// ...
}

or write your own hook:

useStateBinded(initialState) {
  const state = useState(initialState);
  return [...state, state];
}

function MyComponent() {
  const state = useStateBinded('')

  const [value, setValue, state] = state
  return (
    <input bind={bind} />
    // ...
  )
}

function input({bind}) {
  const [value, setValue] = bind
  /// ...
}

[bvaughn]

This looks like a substantial change being proposed. :smile: Changes like this should go through our RFC process:
https://github.com/reactjs/rfcs#react-rfcs

The RFC process is a great opportunity to get more eyeballs on your proposal before it becomes a part of a released version of React. Quite often, even proposals that seem "obvious" can be significantly improved once a wider group of interested people have a chance to weigh in.

The RFC process can also be helpful to encourage discussions about a proposed feature as it is being designed, and incorporate important constraints into the design while it's easier to change, before the design has been fully implemented.