如何使用 將輸入資料作為物件存盤在陣列中useState？請幫忙。我需要幫助。我無法獲得所需的輸出來顯示輸入值。
const Form = () => {
const [allNotes, setAllNotes] = useState([{}]);
const [notes, setNotes] = useState({
name: "",
age: "",
class: "",
request: "",
});
const nameChangeHandler = (event) => {
setNotes((prevState) => {
const newState = { ...prevState, name: event.target.value };
return newState;
});
};
const ageChangeHandler = (event) => {
setNotes((prevState) => {
const newState = { ...prevState, age: event.target.value };
return newState;
});
};
const classChangeHandler = (event) => {
setNotes((prevState) => {
const newState = { ...prevState, class: event.target.value };
return newState;
});
};
const requestChangeHandler = (event) => {
setNotes((prevState) => {
const newState = { ...prevState, request: event.target.value };
return newState;
});
};
const submitHandler = () => {
setAllNotes((prevState) => {
const newState = {
...prevState,
name: notes.name,
age: notes.age,
class: notes.class,
request: notes.request,
};
return newState;
});
};
uj5u.com熱心網友回復：
一切看起來都不錯，也許除了兩個小錯誤：
讓我們為
all notes一個空陣列創建初始狀態，比如const [allNotes, setAllNotes] = useState([]);里面的新陣列
setAllNotes應該是陣列而不是物件，例如：
const submitHandler = () => {
setAllNotes((prevState) => {
const newState = [
...prevState,
{
name: notes.name,
age: notes.age,
class: notes.class,
request: notes.request,
}
];
return newState;
});
};
希望這使它作業！
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/483330.html
標籤：javascript 反应 功能 使用状态
上一篇：字串似乎沒有回傳