Javascript 在React中设置状态

我的react组件上有一个状态变量：

this.state = {
  application: {
    institutions: [{
     "name":null
    }]
  }
}

我想设置变量名的状态，我所做的是：

handleChangeInstitution(event,indexInstitution){

    const institutions = [...this.state.application.institutions]

    institutions[indexInstitution] = {
        ...institutions[indexInstitution],
        [event.target.name]: event.target.value
    }

    this.setState(prevState => ({
        ...prevState,
        application: {
            ...prevState.application,
            institutions: [
                ...institutions,
            ]
        }
    }))

}

这工作很好，但当我在输入框中键入内容时，速度非常慢。

---

有什么方法可以优化它吗？

这里有一个更干净的解决方案。另外，这是更新数组项的一种非常常见的模式。关于性能，在代码的这一部分中，您无能为力。这不应该是这一部分

handleChangeInstitution(event,indexInstitution){
    this.setState(prevState => ({
        ...prevState,
        application: {
            ...prevState.application,
            institutions: [
                ...institutions.slice(0, indexInstitution),
                {
                  ...institutions[indexInstitution],
                  [event.target.name]: event.target.value
                },
                ...institutions.slice(indexInstitution + 1),
            ]
        }
    }))

}

看看这些：还有