reactjs - 向“handleSubmit”注入自定义道具/方法的方法？

Question

我正在使用react hook form，我正在寻找一种方法将自定义道具注入到handleSubmit钩子返回的方法中。Consumer我需要这样做的原因是我的组件充当状态库，我想在提交表单后更新状态。我可能还想将道具传递给该方法。

从查看 API 来看，这似乎是不可能的。关于解决方法或如何做到这一点的任何想法？

Answer 1

我不使用这个库，但似乎getValues从useForm钩子返回的函数打开了将您的组件状态与存储在“react-hook-form”中的表单数据同步的方式：

文档

import React, { useMemo, useEffect, useState } from "react";
import { useForm } from "react-hook-form";

export default function App() {
  const { register, getValues } = useForm();
  const [ valuesState, setValuesState ] = useState();

  const values = useMemo(() => getValues());

  useEffect(() => setValuesState(values), [values]);

  return (
    <form>
      [...]
    </form>
  );
}

Answer 2

为什么不只是在 期间更新状态handleSubmit？

export default function App() {
  const { register, getValues } = useForm();
  const onSubmit = data => {
    // do your state update here update(data)
  }

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      [...]
    </form>
  );
}