javascript - AddActionListener 在初始化而不是点击事件时激活

Question

我正在编写一个在线图表编辑工具，并创建了一个函数来设置我在 init 函数中调用的事件侦听器。我尝试添加许多断点以查看问题出在哪里，似乎 addactionlistener 函数调用了参数中的函数而没有发生动作事件。

init(){
        console.log("Website started");
        myObj = new Draw();
        setUpEventListener();   
    }
    
    gates = {
        or_gate: '#or_gate',
        and_gate: '#and_gate',
        not_gate: '#not_gate'
    }

    shapes = {
        or_gate: '#or_gate_shape',
        and_gate: '#and_gate_shape',
        not_gate: '#not_gate_shape'
    }

    setUpEventListener(){
        document.querySelector('#OrCloneBtn').addEventListener('click', this.ctrlGateSVG(this.gates.or_gate, this.shapes.or_gate));
        document.querySelector('#AndCloneBtn').addEventListener('click', this.ctrlGateSVG(this.gates.and_gate, this.shapes.and_gate));
        document.querySelector('#NotCloneBtn').addEventListener('click', console.log("mathieu"));
    }
    basicAttr = {
        "fill" : "#FFF",
        "stroke" : "black",
        "strokeWidth" : 1
    }
    ctrlGateSVG(gate, shape){
        var to = Snap('#gates');
        var from = Snap(gate);
        var shape = from.select(shape);
        var clone = shape.clone();
        clone.attr(this.basicAttr);
        to.append(clone);
        console.log("clicked")
    }
    

    drawCanvas() {
        var lines = Snap("#lineBackground");
        var height = document.querySelector('.drawPart').clientHeight;
        var width = document.querySelector('.drawPart').clientWidth;
        for(var i=0; i < height; i = i+2){
            lines.line(i, 0, i, height).attr({
            stroke:'black',
            strokeWidth:.2,
        });
        }
        for(i=0; i<width; i=i+2){
            lines.line(0, i, width, i).attr({
                stroke:'black',
                strokeWidth:.2
            });
        }
    }
    init(){
        console.log("Website started");
        var myObj = new Draw();
        this.drawCanvas();
        this.setUpEventListener();  
    }
}

myApp = new DrawingCanvas();
myApp.init();

请你能解释一下这里有什么问题，因为我真的很困惑。

标签： javascriptdomactionlistener