reactjs - TypeScript, 'onChange' 被指定了不止一次，所以这个用法将是

Question

我在 react 项目中使用 material-ui、react-hook-form 和 Typescript，当我尝试在 TextField VScode 中添加 onChange 时，显示错误：

'onChange' 被指定了不止一次，所以这个用法会被覆盖。ts(2783) formComponent.tsx(33, 15)：这个spread 总是覆盖这个属性。

formComponent.tsx：

        <TextField
          variant="standard"
          defaultValue={projectData.name}
          onChange={handleSubmit((data) => console.log(data))}
          {...register('name', { required: true })}
          error={!!errors.name}
        />

标签： reactjstypescriptmaterial-ui

Answer 1

您必须在注册传播后放置 onChange

const textField = register('name', { required: true })

return (
    <input
        className="form-control"
        type="file"
        {...textField}
        onChange={(e) => {
          textField.onChange(e);
          handleSubmit(e);
     }}
    />
)

React 钩子表单：如何在 React Hook 表单版本 7.0 上使用 onChange