我是 React 的新手。我在嘗試處理表單提交時遇到問題。
任何人都知道這個答案，請讓我知道，使用 React Material-UI、React-Hook-Form 與控制器。
我的程式有 3 個文本欄位。計算：PendingTime=ActualTime-作業時間；實際時間是默認值（值為 5）。當我更改 WorkTime Text 欄位值時，Pending Time 會自動更新待定時間值。我在 WorkTime Text 欄位中添加了 onChange 事件。在 OnSubmit 事件中，我需要獲取實際時間值、WorkTimeValue 和 PendingTimeValue。但是我無法獲得 onSubmit 的值。
我在 CodeSandbox 中撰寫了我的代碼。
uj5u.com熱心網友回復：
要回答您的問題，不提交表單的原因是因為您沒有將 Button 組件系結到輸入，將此道具添加到您的組件中，您就可以提交表單
<Button variant="contained" type="submit">Submit</Button>
type="submit" 應該允許提交表單。
現在你有了答案，你沒有正確使用 react hook form，你不應該將React.useState與react-hook-form混合，因為它失去了它的目的，請閱讀關于如何使用帶有輸入的register鉤子的檔案和如果您需要更新輸入值之一，只需注意輸入更改，您就會被讀取。
此外，您會收到警告，因為您有一個嵌套在表單中的表單，因此不要將框用作表單，而是將其更改為 div 或任何有效的 html 嵌套：
<Box
component="div"
sx={{
"& > :not(style)": { m: 1, width: "25ch" }
}}
>
這是一個具有您想要執行的所有功能的作業沙箱： 作業沙箱
這包括每次更改 actualTime 和 workTime 時計算掛起時間，它會正確提交，并且 useState 也被洗掉，因為您不需要它。
uj5u.com熱心網友回復：
form完全洗掉您的標記，并將 onSubmit 處理程式放置在 Box 組件中。看，您將其組件分配給form，這意味著您的表單中有一個嵌套表單。提交按鈕位于嵌套表單內，onClick不會呼叫onSubmit外部表單內的函式。一些 Material-Ui 組件接受一個component屬性，它會創建一個具有指定值的 HTML 標簽。
return (
<Box
onSubmit={handleSubmit(onSubmit)}
component="form"
sx={{
"& > :not(style)": { m: 1, width: "25ch" }
}}
noValidate
autoComplete="off"
>
// ...
</Box>
);
代碼沙盒示例
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/323448.html