Too much useState is it ok?-CodePudding

I have one question, in my app there is a components with like 20 rows of useState(),
it looks like that is not the best way. Can you inform me how you manage your local state ?

Thank you in advance!

CodePudding user response：

That is fine. Sometimes we can have 10-12 lines of useState() calls only. I usually combine similar states in one so that I can use a single variable in my component instead of 5.

Instead of:

const [a, setA] = useState('') 
const [b, setB] = useState('')
const [c, setC] = useState('')
const [d, setD] = useState('')
const [e, setE] = useState('')

I use:

const [letters, setLetters] = useState({
a: '',
b: '',
c: '',
d: '',
e: ''})

and update the state as:

setLetters(prev => ({...prev, c: 'hello'}))

CodePudding user response：

In react 17 each useState and update make your components re-render, but in react 18 (beta in 2020 feb) no difference because setState are batched and cause one re-render