gpt4 book ai didi

reactjs - React 状态正在更新而不调用 setState

转载 作者:行者123 更新时间:2023-12-02 09:09:34 25 4
gpt4 key购买 nike

即使我创建了新变量并且没有调用 setState,我的状态也会改变。

这是我的代码

changeName = (event, id) => {
const persons = [...this.state.persons]; // Create a copy of array using spread operator
const person = persons.find(cur => cur.id === id);
person.name = event.target.value;

console.log(persons);
console.log(this.state.persons);
}

render() {
let allPersonsArr = this.state.persons.map(cur => {
return <Person name={cur.name} age={cur.age} job={cur.job} key={cur.id} change={(event) => this.changeName(event, cur.id)}/>;
});

return(
<div>
{allPersonsArr}
</div>
);
}

state.persons 在使用 person.name = event.target.value 后检查到控制台时发生了变化,即使我指向新数组 persons

最佳答案

Spread 语法只是创建数组的一层深拷贝而不是深拷贝,因为你的数组中有对象,设置 person.name 会改变原始对象

changeName = (event, id) => {
const persons = this.state.persons(person => {
if (person.id === id) {
return {...person, name: event.target.value}
}
return persons;
})
this.setState({ persons })
}

关于reactjs - React 状态正在更新而不调用 setState,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54105170/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com