网站搜索

typescript - 值:UnpackNestedValue<PathValue<T, Path<T>>>


我正在使用 react-hook-form,每当我将 value 作为 prop 传递时,就会出现这个错误 value: UnpackNestedValue<PathValue<T, Path<T>>>。

这是我的开关按钮组件:

type Props<T> = {
  height: number
} & UseControllerProps<T> &
  InputHTMLAttributes<HTMLInputElement>

function SwitchButton<T>(props: Props<T>) {
  const {
    field: { onChange, value },
  } = useController(props)

  return (
    <Switch height={props.height}>
      <input type='checkbox' checked={value} onChange={onChange} />
      <Slider height={props.height}></Slider>
    </Switch>
  )
}

在上述代码中,我在 checked 属性中收到一个错误:类型 'UnpackNestedValue<PathValue<T, Path<T>>>' 不能分配给类型 'boolean | undefined'。

这是我的表格:

const defaultValues = {
  title: '',
  project: {
    id: '',
    title: ''
    },
  isOpen: false,
  ...
  }

const { handleSubmit, control, setError, watch } =
  useForm<FormType>({
    defaultValues,
  })

<form onSubmit={handleSubmit(onSubmitHandler)}>
  <SwitchButton<FormType>
    name='isOpen'
    height={20}
    control={control}
  />
  ...
</form>
import { NestedValue } from 'react-hook-form'

type FormType = {
  title: string
  project: NestedValue<{
    id: string
    title: string
  }>
  isOpen: boolean
  ...
}

我在所有其他表单组件中都遇到了相同的错误,有人知道如何解决吗?谢谢