0

我正在尝试为我的 Vanilla Javascript 迷宫游戏项目创建一个简单的 3、2、1 倒数计时器。我正在尝试合并 MVC 原则以尝试拥有良好的编码结构，但我正在努力弄清楚如何配置我的应用程序的这一部分。

我已经设法将数字 3 呈现到页面上，但它只是停留在那里并且没有被 2、1 取代，这是预期的行为。

我的控制器（index.js）中有倒计时功能：

let timer;

const countDown = () => {
    timer = 3;
    let startTimer = setInterval(() => {
        timer -= 1;
        if (timer < 0) {
            clearInterval(startTimer);
        }
    }, 1000);
}

我的第一个问题是，这种类型的功能应该在控制器中吗？我正在努力理解 MVC 原则。我认为它不应该放在模型文件中，因为它不是应用程序“数据”的一部分，而且我不认为它应该放在视图文件中，因为它在技术上实际上并不处理页面上的渲染。

计时器的渲染在我的视图文件（gameView.js）中完成：

export const renderCountdown = (timer) => {
    elements.timer.innerHTML = timer;
}

countDown 方法和 renderCountdown 方法都会在控制器(index.js) 中的“startGame”方法中调用（当用户单击应用程序上的开始游戏按钮时会调用此方法）：

const startGame = () => {
    countDown();
    renderCountdown(timer);

}

所以我的第二个问题是如何让 2 然后 1 出现在倒数计时器上？

4

0 回答 0