I think the confusion comes from the fact that setting onChange in itself doesn't make the input controlled unless you are setting value as well.
And you are right, the controlled component value needs to be initialized so the input state should be initialized first: const [input, setInput] = useState({ username: "", password: "" }). These initial values could be passed into the custom hook too.
I think the confusion comes from the fact that setting
onChange
in itself doesn't make the input controlled unless you are settingvalue
as well.And you are right, the controlled component value needs to be initialized so the input state should be initialized first:
const [input, setInput] = useState({ username: "", password: "" })
. These initial values could be passed into the custom hook too.this worked. Thanks Orsi :)