真的不知道为什么这么说,但这是我相信它正在谈论的代码
setUpdate(text, key) {
const items = this.state.items;
items.map((item) => {
if (item.key === key) {
item.text = text;
}
});
this.setState({
items: items,
});
}
最佳答案
问题
Array.prototype.map
函数映射一对一关系,生成的数组将与原始数组的长度相同。该错误表明您没有显式返回每个迭代元素的值。
您也不保存生成的映射数组。代码的结果是对 items
的迭代数组和突变 item.text = text;
。在 React 中,state 和 props 被认为是不可变的,直接改变它们是非常反模式的。
setUpdate(text, key){
const items = this.state.items; // <-- saved state reference
items.map(item=>{ // <-- missing result array save
if(item.key===key){
item.text= text; // <-- state mutation!
}
// <-- missing return value (the error)
})
this.setState({
items: items // <-- same reference to previous state!
})
}
解决方案
您将需要浅复制数组以及正在更新的任何嵌套对象。使用功能状态更新从前一个状态的状态数组正确创建下一个状态数组。这样做的原因是下一个版本的items
必然取决于之前的数组。
setUpdate(text, key) {
this.setState((prevState) => ({
items: prevState.items.map((item) =>
item.key === key ? { ...item, key: text } : item
)
}));
}
关于javascript - Array.prototype.map() 需要来自箭头函数 array-callback-return 的返回值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67529109/