我是反應新手，在學習過程中，我嘗試了一些程式碼來理解受控和非受控元件，我使用了 usestate 和 useref。第一次我給出的資料名稱為：john 和age:40 並點擊提交，我看到名字為“prakash”，年齡為40，因為我在提交期間更改了狀態，然後我只將年齡更改為60 並點擊提交，它不會更改年齡，我很想知道，因為我在提交期間更改了狀態，這意味著它需要渲染並將年齡更改為60。您能解釋為什麼它不更改年齡嗎？
import { Fragment, useReducer, useRef, useState } from "react"
export default function Sample()
{
const [name,setname]=useState();
const age=useRef();
const handelsubmit=(e)=>{
e.preventDefault();
setname("prakash")
console.log(`${name},${age.current.value}`)
}
return(
<form onSubmit={handelsubmit}>
<label>name:{name}</label>
<input type="text" onChange={(e)=>setname(e.target.value)} />
<label>age:{age.current?.value==undefined?null:age.current.value}</label>
<input type="text" ref={age}/>
<button>submit</button>
</form>
)
} 
更改年齡輸入值沒有更新顯示的年齡值的原因是您使用 useRef 掛鉤來存取年齡輸入欄位的值，這 當其值變更時不觸發重新渲染。
在您的程式碼中，您將在提交表單時更新姓名狀態，但不會更新年齡狀態。當您使用age.current.value 存取年齡值時，您將直接存取年齡輸入欄位的目前值，而不使用元件的狀態。由於age.current.value的值不是元件狀態的一部分，因此更改它不會觸發重新渲染。
設定name的狀態後，您可以在handelsubmit函數中更新age的狀態：
const [name, setName] = useState(""); const [age, setAge] = useState(""); const ageRef = useRef(); const handleSubmit = (e) => { e.preventDefault(); setName("prakash"); setAge(ageRef.current.value); }; return ();