Javascript 无法读取属性'；价值'；输入字段是否为空？

每当我在

input

字段中键入时，我都会收到以下错误：-

无法读取null的属性“value”

我有一个表单，当我试图键入任何我得到的错误时，我有一个

输入
字段搜索值

这是我的密码

关于这一职能的问题

handleInputFieldChange = (event, name) => {
    this.setState(preState => ({
      ...preState,
      form: {
        ...preState.form,
        [name]: event.target.value
      }
    }));
  };

React-lib本身有一个警告，它基本上指导您如何解决这个问题

警告：出于性能原因，将重用此合成事件。如果
您看到了这一点，您正在访问
发布/取消合成事件此设置为空。如果必须的话
保留原始合成事件，使用
event.persist（）

因此，修复方法是在局部变量中获取目标对象的引用，如下所示

handleInputFieldChange = (event, name) => {
    const { target } = event;
    this.setState(preState => ({
      ...preState,
      form: {
        ...preState.form,
        [name]: target.value
      }
    }));
  };

只有在使用
setState
方法的updater函数时才会发生这种情况。他们要求使用
event.persist（）
，但在我的应用程序中，只需引用
target
对象，就可以在更新函数中使用它，该函数100%工作

签出

该事件是合并的。这意味着该事件
对象将被重用，并且在
已调用事件回调。这是出于性能原因。作为
这样，您就不能以异步方式访问事件

如果希望以异步方式访问事件属性，则
应该对事件调用event.persist（），这将删除
池中的合成事件，并允许创建对该事件的引用
由用户代码保留

仍然存在一个问题，请尝试在输入字段上键入任何内容。您可以为您的输入指定一个name属性，如：在事件处理程序中，只需从目标获取名称和值，而不传递名称并将其设置为以下状态：{…preState.form，[e.target.name]：e.target.value}