Heim > Fragen und Antworten > Hauptteil
Ich habe ein Vue-Projekt mit folgendem Status im Vuex-Speicher:
state: { gameStartTimer: 5, counter: false, randomNumber: Number, clickAlert: false }
Jetzt, in actions
, habe ich Folgendes:
actions: { async startCounter({ state }) { state.counter = true; state.clickAlert = false; while (state.gameStartTimer > 0 && state.counter) { // 这将定时器设置为从5倒数到0 await new Promise(resolve => setTimeout(resolve, 1000)); if (state.counter) state.gameStartTimer--; // if语句确保在gameStartTimer达到0时获取nowTime if (state.gameStartTimer == 0) { let timeNow = new Date().getTime(); state.nowTime = timeNow; } } state.counter = false; // 我想在这里启动第二个定时器,每秒倒计时一次,直到randomNumber状态达到0 await new Promise(resolve => setTimeout(resolve, 1000)); if (state.clickAlert) state.randomNumber--; if (state.randomNumber == 0) { state.clickAlert = true; } } }, }
Das Problem, mit dem ich konfrontiert bin, ist, dass der erste Timer in eine While-Schleife eingeschlossen ist, was genau das ist, was ich möchte, sodass das Spiel bei 5 beginnt und bis 0 herunterzählt.
Dann möchte ich, dass der zweite Timer (mit randomNumber als Dauer) im Hintergrund läuft und dann den clickAlert-Status auf true setzt.
Allerdings kann ich den zweiten Timer nicht in der Async/Await-Methode ausführen. Ich bin nicht ganz sicher, was das Syntax- oder Logikproblem ist.
Für jeden Tipp wäre ich sehr dankbar.
P粉3333954962024-03-31 00:17:48
明显的解决方案似乎是将第二个计时器也放在一个while
循环中。
while (state.randomNumber > 0) { await new Promise(resolve => setTimeout(resolve, 1000)); state.randomNumber--; if (state.randomNumber === 0) { state.clickAlert = true; } }
async/await
只是一种避免回调函数的方法。它在功能上等同于以下代码:
while (state.randomNumber > 0) { setTimeout(() => { state.randomNumber--; }, 1000); }