React 无法读取 [event.target.name] 上未定义的属性“名称”

Question

我在这里有一个使用电话输入的第三方组件，https://github.com/bl00mber/react-phone-input-2#react-phone-input-2 我需要获取用户输入的值，并使用下面处理change的方法设置表单状态：const handlePhoneChange = (event) => {  setFormState({    ...formState,    [event.target.name]: event.target.value,  });};这是我对以下第三方组件的配置：<PhoneInput      country={"us"}      error={hasError("phone")}      helperText={hasError("phone") ? formState.errors.phone[0] : null}      name="phone"      value={formState.values.phone || ""}      onChange={handlePhoneChange}    />但是，当我尝试在phoneInput组件中键入数字时，我收到错误TypeError：无法读取未定义的属性“name”。请帮助我解决这个问题。

Answer 1

如果您阅读 onchange 事件的文档，则有 4 个参数可以访问：。onChange(value, country, e, formattedValue)

您访问的方式不正确，因为您正在访问第一个位置管理，即输入。尝试访问时出错，因为它不是对象。eventvalueevent.targetEvent

该对象可用作第三个位置参数，因此，如果您这样使用它，它应该可以工作：Event

const handlePhoneChange = (value, country, event) => {

  setFormState({

    ...formState,

    [event.target.name]: value,

  });

};