我似乎在将数据推入状态数组时遇到问题。我试图通过这种方式实现它:
this.setState({ myArray: this.state.myArray.push('new value') })
但我相信这是不正确的方式并导致可变性问题?
我似乎在将数据推入状态数组时遇到问题。我试图通过这种方式实现它:
this.setState({ myArray: this.state.myArray.push('new value') })
但我相信这是不正确的方式并导致可变性问题?
使用 es6 可以这样完成:
this.setState({ myArray: [...this.state.myArray, 'new value'] }) //simple value
this.setState({ myArray: [...this.state.myArray, ...[1,2,3] ] }) //another array
this.state.myArray.push('new value')
返回扩展数组的长度,而不是数组本身。Array.prototype.push()。
我猜你希望返回的值是数组。
这似乎是 React 的行为:
永远不要直接改变 this.state,因为之后调用 setState() 可能会替换你所做的改变。将 this.state 视为不可变的。react组件。
我想,你会这样做(不熟悉 React):
var joined = this.state.myArray.concat('new value');
this.setState({ myArray: joined })
从不建议直接改变状态。
在更高版本的 React 中推荐的方法是在修改状态时使用更新程序函数来防止竞争条件:
将字符串推到数组的末尾
this.setState(prevState => ({
myArray: [...prevState.myArray, "new value"]
}))
将字符串推送到数组的开头
this.setState(prevState => ({
myArray: ["new value", ...prevState.myArray]
}))
将对象推到数组的末尾
this.setState(prevState => ({
myArray: [...prevState.myArray, {"name": "object"}]
}))
将对象推送到数组的开头
this.setState(prevState => ({
myArray: [ {"name": "object"}, ...prevState.myArray]
}))
const [array,setArray] = useState([]);
最后推送值:
setArray(oldArray => [...oldArray,newValue] );
在乞讨中推value:
setArray(oldArray => [newValue,...oldArray] );
你根本不应该操作状态。至少,不是直接的。如果你想更新你的数组,你会想要做这样的事情。
var newStateArray = this.state.myArray.slice();
newStateArray.push('new value');
this.setState(myArray: newStateArray);
直接处理状态对象是不可取的。您还可以查看 React 的不变性助手。