我似乎有问题将数据推入一个状态数组。 我正试图以这种方式实现它:
this.setState({ myArray: this.state.myArray.push('new value') })
但我相信这是不正确的方式,并导致问题的可变性?
我似乎有问题将数据推入一个状态数组。 我正试图以这种方式实现它:
this.setState({ myArray: this.state.myArray.push('new value') })
但我相信这是不正确的方式,并导致问题的可变性?
当前回答
功能组件和反应钩子
const [array,setArray] = useState([]);
最后推值:
setArray(oldArray => [...oldArray,newValue] );
在开始时推值:
setArray(oldArray => [newValue,...oldArray] );
其他回答
我想现在回答这个问题有点晚了,但对于那些新来的人来说
你可以使用这个叫做immer的小包
请看这个例子:https://immerjs.github.io/immer/produce
绝不建议直接改变状态。
在以后的React版本中,推荐的方法是在修改状态时使用updater函数来防止竞争条件:
将字符串推到数组的末尾
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]
}))
setState([...prevState, {
label: newState.name,
value: newState.id
}]);
正在与下拉菜单工作,并希望在那里实现这个场景,我发现了这个简单的解决方案下拉多个值。
如果你使用:
const[myArr, setMyArr] = useState([]);
添加:
setMyArr([...myArr, value]);
至于移除:
let index = myArr.indexOf(value);
if(index !== -1)
setPatch([...myArr.slice(0, index), ...myArr.slice(index, myArr.length-1)]);
React-Native
如果你也想要你的用户界面(例如。ur flatList)是最新的,使用PrevState: 在下面的例子中,如果用户点击按钮,它将添加一个新对象到列表中(包括在模型和UI中)。
data: ['shopping','reading'] // declared in constructor
onPress={() => {this.setState((prevState, props) => {
return {data: [new obj].concat(prevState.data) };
})}}.