Reactjs React JS多个提交按钮React钩子窗体

我使用react-hook表单进行表单验证和提交，使用单一提交类型按钮一切正常，现在我需要三个按钮，“保存草稿”、“预览页面中的数据值”和“提交以供批准”，我可以选择退出模式选择单选按钮，但希望有三个按钮提交功能，它需要表单数据。为输入字段添加onchnage将起作用，但表单验证需要再次写入

  const { register, handleSubmit } = useForm();
  const onSubmit = (data) => alert(JSON.stringify(data));
  function NeedTohaveFormDataHere1(Data) {

   } function NeedTohaveFormDataHere2(Data) {

   }
    return (  <form onSubmit={handleSubmit(onSubmit)}>
     <Headers />

  <input name="firstName" ref={register} placeholder="First name" />

  <input name="lastName" ref={register} placeholder="Last name" />

  <select name="category" ref={register}>
    <option value="">Select...</option>
    <option value="A">Category A</option>
    <option value="B">Category B</option>
  </select>
  <button onClick={NeedTohaveFormDataHere1}>
   Save Draft
  </button > 
  <button onClick={NeedTohaveFormDataHere2}>
    Preview
  </button>  
  <input type="submit" />
</form>
 );
 }
 

const{register，handleSubmit}=useForm（）；
const onSubmit=（数据）=>alert（JSON.stringify（数据））；
函数需要在此处具有FormData1（数据）{
}函数需要在此处具有FormData2（数据）{
}
报税表（
选择。。。
A类
B类
保存草稿
预览
);
}

onSubmit函数将获取表单数据，如何在其他两个按钮函数中获取表单数据

解决。。与

  <button onClick={handleSubmit(NeedTohaveFormDataHere1)}>
   Save Draft
  </button > 
  <button onClick={handleSubmit(NeedTohaveFormDataHere2)}>
    Preview
  </button> 

保存草稿
预览

您可以在多个位置使用handleSubmit

const handleSubmitDraft=()=>{
  handleSubmit(aync(data)=>{...})()

}
const handleSubmitPreview=()=>{
  handleSubmit((data)=>{...})()
}

保存草稿
预览

我遇到了同样的问题，我通过以下方式解决了问题：

我有两个按钮，第一个是底部的“正常保存和验证”，第二个是“仅验证和调用自定义函数”。 我想你也一样。保存按钮和草稿按钮

无效0}
标题={仅保存}
>
const handleOnSingAndSave=（）=>{
做事
}

这个问题的解释力太弱了。请给出正确的代码并解释添加的示例代码

<button onClick={handleSubmitDraft}>
   Save Draft
</button > 
<button onClick={handleSubmitPreview}>
    Preview
</button>