I have a series of user data elements that I'm collecting inside a React component using single useState Hook.
const [allValues, setAllValues] = useState<IProduct>({
title: '',
name: '',
category: '',
price: 0,
image: '',
size: [],
color: [],
inStock: true,
});
we can see two of them is array.
const changeHandler = (e: React.ChangeEvent<HTMLInputElement>) => {
setAllValues({ ...allValues, [e.target.name]: e.target.value });
console.log(allValues);
};
and the input box are like these... what are the changes i should make?
<input
type='text'
className='form-control'
id='name'
name='name'
placeholder='Enter a Name'
onChange={changeHandler}
/>
setAllValues({
...allValues,
toUpdate: newValue
});
Is different from
setAllValues(prev => ({
...prev,
toUpdate: newValue
}));
Hope it helps
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.