时间戳

首页 > 解决方案 > 如何在 Node.js 中使用第二个构造函数的变量？（使用导入/导出）

javascript - 如何在 Node.js 中使用第二个构造函数的变量？（使用导入/导出）

问题描述

我有 3 个不同.js的文件，它们通过import/export关键字在它们之间链接。每个文件都有自己的特定功能，如下所示：

  1. Init.js: 调用Event.js和Touch.js。将变量发送到 Event.js.

  2. Event.js: 接收来自每个元素的变量Init.js并将其注册 event到每个元素。

  3. Touch.js: 识别eventidEvent.js然后记录它。

一个问题是 的构造函数Touch.js根本不起作用。浏览器无法访问它。undefined当我尝试将名为Aand的局部变量记录下来时，它会一直触发B。

我发现的唯一可能的方法是从 中创建变量Init.js，将它们传递给Event.js，然后再次传递给 ，Touch.js就像我在下面所做的那样。

有没有办法使用自己的构造函数的局部变量？

请看下面的代码：

//============== Init.js ==============
'use strict';
import {Event} from './event.js';
import { proTouch } from './touch.js';
const slider = (function() {
    class Slider {
        constructor(elem) {
            this.elem = document.querySelectorAll(elem);
            this.C = false;
            this.Event = new Event();
            this.Event.register(this.elem, 'mouseenter', proTouch.start, this.C);
        }
    }
    return {
        initialize: new Slider('.box')
    }
}());

//============== Event.js ==============

export class Event {
    constructor() {

    }
    register(node, eventName, callback, flag) {
        let bind = callback.bind(this);
        node.forEach(cur => {
            cur.addEventListener(eventName, (e) => bind(e, flag))
        })
    }
}


//============== Touch.js ==============

class Touch {
    constructor() {
        this.A = false;
        this.B = true; // <-- I want to use this constructor function.
    }
    start(e, flag) {
        console.log(e.type, this.A, this.B, flag); // <-- this.A and this.B fire undefined.
    }
}
const proTouch = new Touch();
export { proTouch }

标签： javascriptnode.jsimportconstructorexport

解决方案

在您的Event课程中，您将回调绑定到this. 这是错误的，因为在这种情况下this是Event实例并且不包含a或b变量。删除该行。

let bind = callback.bind(this);//Wrong. Delete this line.

当您发送回调时，您希望将 绑定proTouch到start方法。所以，绑定那里。

this.Event.register(this.elem, 'mouseenter', proTouch.start.bind(proTouch), this.C);

推荐阅读