如何在React组件中设置状态.setState,而不显式地传递字段名来更新

How to set state in a React component using this.setState without explicitly passing the field name to update?

本文关键字:字段 更新 组件 React 设置 setState 状态      更新时间:2023-09-26

我的组件中有一个表单,它有许多输入字段,通过一个名为"handleFieldEdit"的事件处理程序更新本地状态。

我想将本地状态设置为用户在输入字段中输入的任何内容,但我不知道用户将使用哪个字段,所以我尝试这样设置状态:

handleFieldEdit(event) {
        this.setState({
            event.target.name: event.target.value
        });
}

这不起作用。我认为这可以用一个简单的Javascript语法技巧来解决,但是react方法setState让我迷惑了。我该如何设置状态呢?

使用计算属性名:

    this.setState({
        [event.target.name]: event.target.value
    });