React Hook Form中defaultValues不更新问题咨询

React Hook Form 的 useForm 钩子中，defaultValues 仅在组件首次挂载时被用来初始化表单状态，后续即使传入的 user props 更新，defaultValues 也不会自动同步到表单中。这是因为 useForm 内部不会监听 defaultValues 的变化，它的设计初衷就是作为表单的初始值，而非动态更新的数据源。

当你期望通过更新 defaultValues 来同步新的 user 数据时，由于 useForm 已经完成初始化，后续的 defaultValues 变更不会触发表单状态的更新——这个配置项只在钩子初始化阶段起作用。

你当前使用 useEffect 结合 reset 方法同步表单值的方式，其实是 React Hook Form 官方推荐的动态更新表单值的方案，完全符合最佳实践。

可以把生成默认值的逻辑抽成独立函数，让代码更简洁：

export function UpdateTeacherForm({ user }: { user: User }) {
  const getFormDefaultValues = () => ({
    avatar: user.avatar ? toUploaderFile(user.avatar) : undefined,
    video: user.video ? toUploaderFile(user.video) : undefined,
    description: user.description,
    phoneNumber: user.phoneNumber,
  });

  const {
    register,
    control,
    handleSubmit,
    reset,
    formState: { errors, isDirty, isValid },
  } = useForm<UpdateTeacherSchemaType>({
    resolver: zodResolver(updateTeacherSchema),
    mode: 'all',
    defaultValues: getFormDefaultValues(),
  });

  useEffect(() => {
    reset(getFormDefaultValues());
  }, [user]);

  // 其他表单逻辑...
}

内容的提问来源于stack exchange，提问作者Korer