如何在React中将新值推送到对象数组中

Question

我认为这个问题可能很愚蠢，但相信我是React的新手。我试图将新的键和值推送到对象的数组中，但我做不到。有人能帮助我如何实现我的目标吗。感谢

代码

this.state= {
cartItems=[
{name:'item1',price:'$23'},
{name:'item2',price:'$26'},
{name:'item3',price:'$24'},
]

我想在对象数组的末尾添加像quantity:0这样的新值。请帮我

Answer 1

如果要更新状态，为每个对象添加一个属性，只需将setState与map结合使用即可。Array.prototype.map允许您变换每个对象，如下所示：

this.setState(state => {
cartItems: state.cartItems.map(cartItem => ({ 
...cartItem, // Keep all old properties
quantity: 0 // Add quantity
})
})

只有在初始化器之后调用setState时才应该执行此操作。如果在分配给this.state时需要修改数据权限，只需直接映射数组即可。

Answer 2

也许可以试试这个

const newState = this.state.cartItems.map(item => {
item.quantity = 0;
return item;
});
this.setState({cartItems: newState});

Answer 3

this.state= {
cartItems:[
{name:'item1',price:'$23'},
{name:'item2',price:'$26'},
{name:'item3',price:'$24'},
]
}
updateCartItems=()=>{ 
var cartItems = this.state.cartItems.map((item)=>{
return {...item,quantity:0}
})
this.setState({cartItems})
}