我试图在我的“数据”数组中的特定点添加一个对象，这是这个组件状态。以下不起作用，数组只是被清空。
addNewBulletAfterActive = () => {
const array = this.state.data;
const newBulletPoint = {
id: this.state.data.length += 1,
title: 'Click to add'
};
const newData = array.splice(this.state.activeBulletPointId, 0, newBulletPoint);
this.setState({
data: newData
});
}
这个想法是，如果我有一个包含 10 个项目符号的列表，用户可以单击第 4 个项目符号，然后直接按 Enter 键添加一个新的项目符号。我在将项目添加到数组末尾时没有遇到任何问题，但看起来 .splice 导致了问题。
我相信这应该可以满足您的要求。
function addAfter(array, index, newItem) {
return [
...array.slice(0, index),
newItem,
...array.slice(index)
];
}
此函数返回一个新数组，其中插入了一个新项目。它不会改变您的原始数组，因此可以很好地处理组件的状态和 Redux。
然后，您可以将此函数的输出分配给您的状态。
splice 返回拼接的项目（因为你拼接了 0 个项目，所以它是空的）并改变原始数组。
const newData = array.slice(0); // copy
newData.splice(this.state.activeBulletPointId, 0, newBulletPoint);
this.setState({
data: newData
});
我认为这可能是一种更简单快捷的方法来做到这一点
/*Just plain JS*/
function AddAfter(array, newObject){
array.unshift(newObject);
}
/*In react If updating state*/
var _prev = this.state.your_array; //getting the current value for the state object
var newInfo = {id: 1, more: 'This is a new object'};
_prev.unshift(newInfo);