Question

我对es6相当新，但是想要将我的jQuery代码重新创建为干净的es6模块（每个模块一个文件），然后删除jQuery。但是我已经通过将一个简单的事件处理程序绑定到我的按钮而迷失了。

这是我目前的button.js文件：

import forEach from 'lodash/forEach';

export default class Buttons {
    constructor(root) {
        console.log('constructor hello');
        this.root = document.body;
        this.buttons = this.root.querySelectorAll('.default-button');
        this.bind();
    }

    bind() {
        console.log('bind hello');
        forEach(this.buttons, (button) => {
            button.addEventListener('click', () => {
                console.log('Click event just for test purpose');
            })
        })
    }
}

这是我的main.js文件

class sitemodules {
    constructor() {
        sitemodules.domReady().then(this.ready.bind(this));
    }

    ready() {
        this.initButtons();
    }

    initButtons() {
        new Buttons();
    }

    static domReady() {
        return new Promise((resolve) => {
            document.addEventListener('DOMContentLoaded', resolve);
        });
    }
}

new sitemodules();

'构造函数hello'和'bind hello'在控制台中被触发，但我无法获得使用click侦听器实现的消息，因此似乎没有正确添加eventlistener。

无法绑定es6模块语法

0 个答案: