How can set array useState in loop for add more item in default array?

Question

I had an array with 10 item First, I added 5 item in useState

const [dataList, setDataList] = useState([])
useEffect(() => {
  const newArr = []
  for (var i = 0; i < 5 && i < data.length; i++) {
       newArr.push(data[i])
      }
      setDataList(newArr)
    }, [])

Then, when I added 5 item left, I got not expect result

onPress = () => {
    const newArr2 = []
    for (var i = 5; i < 10 && i < data.length; i++) {
        newArr2.push(data[i])
    }
    setDataList([...dataList, newArr2])
    console.log("dataList", dataList)
}

https://i.sstatic.net/lB0JD.png

How can I push 5 item left into the useState array? Sorry for my bad English.

Bakhtiiar Muzakparov · Accepted Answer · 2019-10-01 05:32:52Z

3

The alternative to spread syntax could be:

setDataList(dataList.concat(newArr2))

answered Oct 1, 2019 at 5:32

Bakhtiiar Muzakparov

2,4482 gold badges17 silver badges24 bronze badges

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

Comments

Chris B. · Accepted Answer · 2019-10-01 05:05:30Z

3

You are spreading your current array, but not the new one:

setDataList([...dataList, ...newArr2])

answered Oct 1, 2019 at 5:05

Chris B.

5,7711 gold badge17 silver badges31 bronze badges

Collectives™ on Stack Overflow

How can set array useState in loop for add more item in default array?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related