問題： 如何從表單中的 [data] 更新嵌套狀態而不會出現任何錯誤。我現在這樣做的方式有效，但它在控制臺中引發了一個錯誤。從表單更新嵌套狀態的正確方法是什么。
我知道資料被初始化為空，這僅僅是因為它是在使用 useEffect 加載頁面時設定的。
代碼：
const [data, setData] = useState({});
<Form.Group className="mb-3">
<Form.Label>Title</Form.Label>
<Form.Control
required
placeholder="Enter title"
value={data?.title}
onChange={(e) => setData({...data, title: e.target.value})}
/>
{formError?.title?.length > 0 ? <Form.Label className="text-danger">{formError?.title}</Form.Label> : null}
</Form.Group>
uj5u.com熱心網友回復：
React 會將其視為不受控制的組件，因為該value屬性undefined最初是并且您將其設定為stringon Change of value。
對于不受控制的輸入，我們不會傳遞該value屬性。如果我們不傳遞任何屬性，則將其視為undefined. 在這里，您首先將其設定為undefined然后再設定一些值，從而使您感到困惑。這就是你收到changing from uncontrolled to controlled input警告的原因。
在狀態中提供默認值以將其用作受控輸入。
const [data, setData] = useState({title: ""});
或者value={data?.title || ""}
查看更多受控/非受控組件
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/422670.html
標籤：