使用React Router Data Loader导航到新路由时,React Hook Form defaultValues未更新

我认为这是因为 useForm 挂钩持续存在于 即使数据已经更新,也会进行渲染。

是的 使用窗体 钩子状态持续存在,因为 Product 当只有路由路径参数更新时,组件保持安装状态,例如当 "/product/:productId" 路线仍然匹配和渲染。

把 使用窗体 钩内 useEffect 那个 取决于 data 从装载机?

你的想法是正确的,尽管你不能从使用中调用任何React钩子 使用效果 回调,因为这会破坏 Rules of Hooks ,例如“不要在传递给的函数内部调用Hook useMemo , useReducer 或 使用效果 ".

你可以 reset 加载时的表单数据 数据 价值更新。

基本示例:

export const Product = (props) => {
  const data = useLoaderData();
  const navigate = useNavigate();

  const formMethods = useForm({ defaultValues: data });

  React.useEffect(() => {
    if (data) {
      formMethods.reset(data, /* any reset options */);
    }
  }, [data]);

  return <...>
};