為什么我不能在第一次點擊時設定資料，我必須輸入兩次才能設定資料。 謝謝你的幫助....
export default function App（） {
const [title, setTitle] = useState（）。
const [projectData, setProjectData] = useState([] )。
const handleSubmit=（e）=> {
e.preventDefault（）。
setProjectData([...projectData, { projectTitle: title }]) 。
console.log（projectData）。
};
return (
<div className="App"/span>>
<input
type="text"/span>
onChange={(e) => {
setTitle(e.target.value)。
}}
/>
<button onClick={handleSubmit}> 插入</button>
</div>
);
}
uj5u.com熱心網友回復：
事實上，它做到了，但是setState鉤子是異步運行的，所以之后的console.log不會反映變化。你可以使用useEffect來觀察projectData的變化來代替
import React, { useEffect, useState } from "react"。
export default function App（）{
const [title, setTitle] = useState（）。
const [projectData, setProjectData] = useState([] )。
useEffect(() => {
console.log（projectData）。
}, [projectData])。
const handleSubmit=（e）=> {
e.preventDefault（）。
setProjectData([...projectData, { projectTitle: title }]) 。
};
return (
<div className="App"/span>>
<input
type="text"/span>
onChange={(e) => {
setTitle(e.target.value)。
}}
/>
<button onClick={handleSubmit}> 插入</button>
</div>
);
}
uj5u.com熱心網友回復：
在React中，setState動作是異步的，并且為了提高性能而被分批執行。這在setState的檔案中有所解釋。
如果你想記錄projectData，你可以使用useEffect掛鉤。
const handleSubmit=（e）=> {
e.preventDefault（）。
setProjectData([...projectData, { projectTitle: title }]) 。
};
// useEffect with ProjectData as dependency .
useEffect(() => {
console.log（projectData）。
}, [projectData])。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/306988.html
標籤：
上一篇：樣式化的組件不想在螢屏上渲染