我收到此警告，但我無法找出原因：“value標簽上的prop 值無效。要么將其從元素中洗掉，要么傳遞一個字串或數字值以將其保留在 DOM 中。”
const [inputValues, setInputValues] = useState({});
const sendPost = async () => {
if (inputValues.link.length > 0) {
setPostList([...postList, inputValues]);
setInputValues('');
} else {
console.log('Empty inputs. Try again.');
}
};
const onInputChange = (event) => {
const name = event.target.name;
const value = event.target.value;
setInputValues(values => ({...values, [name]: value}))
};
const renderConnectedContainer = () => (
<div className="connected-container">
<form
onSubmit={(event) => {
event.preventDefault();
sendPost();
}}
>
<input
type="text"
placeholder="Enter title!"
name="title" value={inputValues.title || ""}
onChange={onInputChange}/>
<input
type="text"
placeholder="Enter link!"
name="link"
value={inputValues.link || ""}
onChange={onInputChange}/>
<textarea
type="text-area"
placeholder="Enter description!"
name="description"
value={inputValues.description || ""}
onChange={onInputChange}/>
<button type="submit" className="cta-button submit-post-button">Submit</button>
</form>
</div>
);
uj5u.com熱心網友回復：
在sendPost處理程式中，您將inputValues狀態重置為空字串，''而不是回傳到空物件的初始狀態{}。inputValues.title沒問題，因為它只是未定義，但inputValues.link（即''.link）實際上是一個已棄用的函式。
字串.prototype.link
已棄用：不再推薦此功能。雖然一些瀏覽器可能仍然支持它，但它可能已經從相關的 Web 標準中洗掉，可能正在被洗掉，或者可能只是為了兼容性目的而保留。避免使用它，并盡可能更新現有代碼；請參閱本頁底部的兼容性表以指導您的決定。請注意，此功能可能隨時停止作業。
該
link()方法創建一個字串，表示一個<a>HTML 元素的代碼， 用作到另一個 URL 的超文本鏈接。
只需將其重置inputValues回初始狀態即可。
const sendPost = async () => {
if (inputValues.link.length > 0) {
setPostList([...postList, inputValues]);
setInputValues({});
} else {
console.log('Empty inputs. Try again.');
}
};
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/379254.html
標籤：javascript 反应 反应钩子