如何使用 setState 插入 React 的状态数组?

IT技术 javascript arrays reactjs
2021-04-29 09:33:02

我正在寻找在react中修改和排列并在特定索引上插入元素。这是我的状态的样子:

this.state = {arr: ['', '', '', '' ]}

我想做的是编译它arr[index] = 'random element'以响应 js setState 语法。我试图做的是:

this.setState({ arr[index]: 'random element' })

但失败了,你!

4个回答

在此处输入图片说明

使用 克隆当前状态slice()通过这样做,原始状态保持不受影响,直到setState()克隆后,对克隆的数组进行操作并将其设置为状态。上一个答案将改变状态。在此处阅读有关此内容的信息

let a = this.state.arr.slice(); //creates the clone of the state
a[index] = "random element";
this.setState({arr: a});

使用扩展运算符https://codeburst.io/javascript-es6-the-spread-syntax-f5c35525f754

let newChild = "newChild"

this.setState({
    children: [
        ...this.state.children,
        newChild
    ]
})

更新

只需按照此处的建议使用Object.assign()即可复制您的状态。

因此,您可以按如下方式进行:

let new_state = Object.assign({}, this.state); 
let a = new_state.arr;
a[index] = "random element";
this.setState({arr: a});

希望能帮助到你。

像这样的事情会起作用。

状态数组

const [myArray, setMyArray] = useState<string[]>([])

添加到状态数组

function onChangeArray(newValue: string) {
    setMyArray(myArray => [...myArray, newValue)
}