我在 React 和 Node.js 中制作了一個觸摸打字游戲，我想讓 TypeScript 頁面中的函陣列件更新一個全域共享的 EXP 變數，以便玩家可以瀏覽應用程式頁面并保留他們獲得的 XP。一旦他們關閉應用程式，變數就可以重置，它只需要每個會話。這是XP里面的一些代碼，type.tsx它是一個在路由中呼叫的函陣列件App.js
Type.tsx
...
if (currIndex 1 === length) {
xpM = xpM 1;
bonusCounter = bonusCounter 1;
err = err errorChar;
currXP = xp * correctChar;
addXP = (currXP - (err * 2)) * xpM;
xpPercent = Math.round((uXP/xpNeed) * 100);
(gain as HTMLAudioElement).play();
console.log(xpPercent);
if (err > correctChar) {
addXP = correctChar * 3;
}
tXP = tXP addXP;
uXP = tXP;
...
我希望 tXP、xpNeed 和級別變數可以從 Select Test 組件以及其他打字頁面訪問（有 6 種不同的測驗，使用不同的文本陣列來填充打字文本。）我讀過 Redux 可以做到這一點但在調查之后，我似乎需要重新構建整個應用程式才能使用 Redux 工具。有沒有一種快速而骯臟的方法來實作這一目標？該應用程式僅用作正在開發的大型 Unity 游戲的演示，因此它不必是超級優雅或復雜的解決方案。謝謝！
uj5u.com熱心網友回復：
由于不適合 SO 的自以為是的答案，這個問題很可能會被關閉。
但是...我建議您使用React Context在您的組件之間共享狀態。您可以創建可從相關組件訪問的 EXP 變數并共享更新。
如果您需要保持服務器同步，您可以在上面的 Context Provider 中更新本地狀態時發布 EXP 增量，或者如果您需要實時通信并且游戲非常健談，則使用socket.io。
uj5u.com熱心網友回復：
為全域變數及其方法創建一個類：
export default class GlobalVariables {
static createVariables() {
//set here variables you want to be global
this.tXP = 0;
}
static getXP() {//method to get XP
return this.tXP;
}
static addXP(value) {//method to add XP
this.tXP = value;
}
//create others methods you want for your variables
}
在您的啟動組件中匯入類并呼叫 createVariables（在應用程式啟動時呼叫）：
import GlobalVariables from './Global'
...
GlobalVariables.createVariables()
...
在您的其他組件中匯入該類并使用其他方法：
import GlobalVariables from './Global'
...
GlobalVariables.addXP(5);
console.log(GlobalVariables.getXP())
...
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/326527.html
標籤：javascript 节点.js 反应 打字稿 变量