javascript - 如何在课堂上正确添加内联监听器？

Question

在这种情况下，我正在尝试向按钮添加内联侦听器，但我不希望如何正确执行此操作，我想要使用参数，但即使没有它也无法工作：

class App {
  constructor() {
    this.init();
  }

  init() {
    document.body.innerHTML = `
      <button onclick="this.test()">click me</button>
    `;
  }

  test() {
    console.log("test");
  }
}

const app = new App();

标签： javascriptclasslistener

Answer 1

this内联侦听器内部是按钮本身。你需要这样的东西：

class App {
  constructor() {
    this.init();
  }

  init() {
    document.body.innerHTML = `
      <button>click me</button>
    `;
    document.body.querySelector('button').onclick = this.test;
  }

  test() {
    console.log("test");
  }
}

const app = new App();