Correct adding element to array of objects in React Native

Question

I have an array of objects that I get from API call like this:

            new Promise((resolve) => {
            Kit.getSamples(FirstSample, (err, results) => {
                if (err) {
                    return resolve([]);
                }
                const newData = results.map(item => { return { ...item, name: 'FirstItem' } });
                this.setState({
                    ActivityItem: newData
                })
            })

My date is added correctly. But then, I need to do another call to API, and add other values to the array, but with a different name.

            Kit.getSamples(SecondSample, (err, results) => {
                if (err) {
                    return resolve([]);
                }
                const newData = results.map(item => { return { ...item, name: 'SecondItem' } });
                this.setState({ ActivityItem: [...this.state.ActivityItem, ...[newData]]})

But instead of proper adding to the array, I get an new array inside my array like this:

[{"name": "FirstItem", "quantity": 11, "tracked": false}, 
{"name": "FirstItem", "quantity": 21, "tracked": true},
[{"distance": 0.310685596118667, "name": "SecondItem", "tracked": false}]]

I wonder if there is a way to add "SecondItem" without having another array inside?

Shubham Khatri · Accepted Answer · 2020-04-26 18:28:16Z

1

newData is already an array once you obtain it by mapping over results, you don't need to wrap it within [] before using spread syntax while setting state

this.setState({ ActivityItem: [...this.state.ActivityItem, ...newData]})

answered Apr 26, 2020 at 18:28

Shubham Khatri

284k58 gold badges431 silver badges411 bronze badges

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

Comments

Victor Alessander · Accepted Answer · 2020-04-26 18:26:52Z

0

...[newData] is wrapped in an array, so, the result will be inside an array.

Try removing the brackets, like this: ...newData

answered Apr 26, 2020 at 18:26

Victor Alessander

1729 bronze badges

Comments

Shahid ali · Accepted Answer · 2020-04-26 18:31:03Z

0

You need to replace the following line

this.setState({ ActivityItem: [...this.state.ActivityItem, ...[newData]]})

with this line

this.setState({ ActivityItem: [...this.state.ActivityItem, ...newData]})

answered Apr 26, 2020 at 18:31

Shahid ali

2442 silver badges5 bronze badges

Collectives™ on Stack Overflow

Correct adding element to array of objects in React Native

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related