2016-10-02 93 views
0

我可能missunderstood了一些概念,但在阅读4个主题上的stackoverflow和“私人成员在打字稿”的文档 - 我仍然困惑。打字稿私人方法“不是一个功能”

我正在写简单的鼠标IO(第一个打字稿项目)。这是发生故障的鼠标类的全码:

class Mouse { 
    public left: MouseKeyData = new MouseKeyData(); 
    public right: MouseKeyData = new MouseKeyData(); 
    public whell: MouseKeyData = new MouseKeyData(); 

    public x: number = 0; 
    public y: number = 0; 

    private crossBrowserButton(e: any):string { 
     switch (e.button) { 
      case 0: return 'left'; 
      case 1: return 'whell'; 
      case 2: return 'right'; 
      case 3: return 'back'; 
      case 4: return 'forward'; 
     } 
     return 'none'; 
    } 


    private onMouseDown(e: any):void { 
     let target: MouseKeyData = this.left; 
     try {console.log(this.crossBrowserButton(e))} catch (a) {console.warn(a)} finally {} 
     if(target) { 
      target.press(); 
     } 
    } 

    private onMouseUp(e: any):void { 
     let target: MouseKeyData = this.left; 
     if(target) { 
      target.release(); 
     } 
    } 

    private onMouseMove(e: any): void { 
     this.x = e.pageX; 
     this.y = e.pageY; 
    } 

    public constructor() { 
     let anchor = document.body; 

     anchor.addEventListener('mousedown', this.onMouseDown); 
     anchor.addEventListener('mouseup', this.onMouseUp); 
     anchor.addEventListener('mousemove', this.onMouseMove); 

    } 
} 

我习惯叫this.crossBrowserButton(e)onMouseDownonMouseUp,但我只this.crossBrowserButton is not a function(…)了。

我觉得我失去了this范围一些在这里,但this.left完美的作品。

在此先感谢!

+0

我正在投票结束这个问题,因为这个错误在低技术水平的世界很常见,我想通了什么是错的。 –

回答

1

听起来像你做了你应该做的完全相反。在您的原始代码中,您的事件侦听器的执行范围存在问题。它们不受类的范围限制,因此将在它们运行的​​上下文中执行。

你的事件绑定应该看起来像这样。

anchor.addEventListener('mousedown', this.onMouseDown.bind(this)); 
    anchor.addEventListener('mouseup', this.onMouseUp.bind(this)); 
    anchor.addEventListener('mousemove', this.onMouseMove.bind(this)); 
0

好吧,我想通了:我绑定this到document.body中,然后 - 我把这个this的方法。

感谢您的评价。晚安伙计!