所以基本上我正在嘗試為我的游戲實作重啟功能,并且我希望能夠以某種方式“重新加載”我的 GameView 組件。這是生命周期: 1. React 渲染/安裝我的組件 2. 用戶與組件互動并且它發生了變化 3. 現在,我想呼叫一個函式來清除所有這些變化并帶來組件(及其所有子組件)回到步驟 1 中的狀態。這是我想到的兩種可能的解決方案:
- 保持相同的組件并將所有狀態變數設定回它們的初始化值
- 制作新組件并替換舊組件
第一個不是很實用,因為當涉及子組件時它變得非常復雜,而第二個不起作用,因為顯然 React 仍然認為新組件與舊組件相同,因為它們具有相同的道具?我不知道為什么,但我無法讓它作業。
我將不勝感激一些幫助!
uj5u.com熱心網友回復:
您可以使用 akey強制做出反應以卸載和重新安裝組件。鍵提供了有關來自一個渲染的哪個元素對應于下一個渲染的哪個元素的附加資訊。如果鍵不同,那么這告訴反應它們是不同的元素,即使它們具有相同的型別。
const App = () => {
const [gameNumber, setGameNumber] = useState();
const resetGameView = () => {
setGameNumber(prev => prev 1);
}
return (
<div>
<GameView key={gameNumber} />
</div>
);
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/475714.html
標籤:javascript 反应 组件
