How to use useState with TextField?

[mattbal]

Hi,
I'm trying to use useState with TextField, but I'm not sure how. I've read the documentation and I think there are two options:
A) The default React way
B) By using the value and onChange properties of TextField

Which approach is better, A or B?

A.

const [text, setText] = useState('');

return (
  <TextField>
    <Label>Job post URL</Label>
    <Input
      value={text}
      onChange={(e) => setText(e.target.value)}
    />
  </TextField>
)

B.

const [text, setText] = useState('');

return (
  <TextField value={text} onChange={setText}>
    <Label>Job post URL < /Label>
    <Input/>
  </TextField>
)

[reidbarber]

You'll want to use B so that the value can propagate down to other subcomponents of TextField that might need to use it, like <FieldError /> for validation, and also receive accessibility features provided by useTextField.

Under the hood, passing it into TextField means it uses the useTextField hook, while just passing it to Input is similar to just using a native <input />.

[mattbal]

Thanks!