how to update react hooks array state?

Question

I have react-hooks with array state. I would like to update my date data from this code.

const [[birthYear, birthMonth, birthDay], setStudentDob] = useState([]);

how can I change with the OnChange event on reacts?

//date
<select
    value={birthDay}
    onChange={handelDate}
    name='day'
>
<option value='0'>Day</option>
<option value='01'>01</option>
<option value='02'>02</option>
<option value='03'>03</option>
</select>   
//birthMonth
<select
    value={birthMonth}
    onChange={handelDate}
    name='month'
>
<option value='0'>Day</option>
<option value='01'>january</option>
<option value='02'>february</option>
<option value='03'>march</option>
</select>
</select>   
//birthYear
<select
    value={birthYear}
    onChange={handelDate}
    name='year'
>
<option value='0'>Day</option>
<option value='2020'>2020</option>
<option value='2021'>2021</option>
<option value='2020'>2022</option>
</select>

if you have any preferable way to update please help me to find out these issues.

Hakim Abdelcadir · Accepted Answer · 2022-04-27 08:26:30Z

1

The handleDate can be like this:

const handleDate = (value, index) => {
    setStudentDob(s => {
      let arr = [...s];
      arr[index] = value;
      return arr;
    })
}

Make sure to pass the correct parameters in the onChange handler:

<select
    value={birthDay}
    onChange={e => handleDate(e.target.value, 2)}
    name='day'
>

<select
    value={birthMonth}
    onChange={e => handleDate(e.target.value, 1)}
    name='month'
>

<select
    value={birthYear}
    onChange={e => handleDate(e.target.value, 0)}
    name='year'
>

answered Apr 27, 2022 at 8:26

Hakim Abdelcadir

1,3266 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to update react hooks array state?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related