每次发出事件时如何创建消息

Question

我正在尝试实现一个应用程序，该应用程序在每次节拍滴答声时为每个歌词创建一个“.message”。但是，我在尝试提出算法时似乎碰壁了。

我的代码：

import EventEmitter from "eventemitter3";
import Beat from "./Beat";

export default class Application extends EventEmitter {
  static get events() {
    return {
      READY: "ready",
    };
  }

  constructor() {
    super();
    
    this._beat = new Beat();
    this._create();

    this.emit(Application.events.READY);
  }
  _create() {
    const lyrics = ["Ah", "ha", "ha", "ha", "stayin' alive", "stayin' alive"];
    let count = 0;

    this._beat.on("update", (bit) => {
      const message = document.createElement("div");
      message.classList.add("message");
      message.innerText = lyrics[bit];

      document.querySelector(".main").appendChild(message);
    })
  }
}

节拍间隔：

import EventEmitter from "eventemitter3";
export default class Beat extends EventEmitter{
  static get events() {
    return {
      BIT: "bit",
    };
  }

  constructor() {
    super();
    setInterval(() => {
      console.log("bit");
      this.emit(Beat.events.BIT);
    }, 600);
  }
}

Answer 1

您正在订阅 'update' 事件，该事件从未被触发。

固定代码sn-p：

    this._beat.on(Beat.events.BIT, (bit) => {
      const message = document.createElement("div");
      message.classList.add("message");
      message.innerText = lyrics[bit];

      document.querySelector(".main").appendChild(message);
    })