我嘗試從輸入中收集資料并將其傳遞到下一頁，在表單中添加單選按鈕后，代碼作業正常，但是，Chrome 上的瀏覽??器控制臺給了我如下警告：
警告：您在沒有 `onChange` 處理程式的情況下為表單欄位提供了 `checked` 屬性。這將呈現一個只讀欄位。如果該欄位應該是可變的，請使用 `defaultChecked`。否則，設定 `onChange` 或 `readOnly`。
這意味著什么？以及如何解決？
（我是 React 的新手。感謝您的時間）
以下是代碼：
import {useLocation} from 'react-router-dom';
import { useState } from "react";
import { useNavigate } from "react-router-dom";
const Second = () => {
const navigate = useNavigate();
const location = useLocation();
const contact=location.state;
const [name, setName] = useState("");
const [wording, setWording] = useState("");
const handleSecSubmit = (e) => {
e.preventDefault();
const contacttotal={
...contact,
...{name},
...{wording}
};
console.log(contacttotal);
navigate("/final", { state: { contacttotal } });
}
return (
<div className="Second">
<h1>This is Second Input Page</h1>
<form autoComplete="on" onSubmit={handleSecSubmit}>
<dd>Name</dd>
<input
type="text"
value={name}
onChange={(e) =>
setName(e.target.value)
}
required
></input>
<dd>Wording</dd>
<div>
<div onChange={(e) => setWording(e.target.value)}>
<label><input
type="radio"
value='United States'
name="wording"
checked={wording === "United States"}
/>United States</label>
<label><input
type="radio"
value='British'
name="wording"
checked={wording === "British"}
/>British</label>
</div>
</div>
<br/>
<button>submit</button>
</form>
</div>
);
}
export default Second;
uj5u.com熱心網友回復：
只需將onChange事件添加到每個input.
<input
type="radio"
value='United States'
name="wording"
checked={wording === "United States"}
onChange={(e) => setWording(e.target.value)}
/>
并將其從div. 在,或onChange之外的其他元素上使用 event 不是最好的主意。inputtextareaselect
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/520560.html
標籤：反应单选按钮