javascript - 尝试从点击事件 coffeescript 调用 'this'

Question

我正在尝试在单击时响应 Canvas 中的某些内容。我在类 Board

的一个函数中向 Canvas 添加了一个 mousedown 事件监听器

addEvents : () ->
    @.canvas.addEventListener('mousedown',@.mouseDown)
mouseDown : (e) ->
    console.log(e,@)

上面的两个函数在Board类中，当点击 Canvas 时，我想从@返回板，但它返回的是 Canvas 。

我尝试将事件监听器/鼠标按下功能更改为:

addEvents : () ->
    @.canvas.addEventListener('mousedown',(e)->@.mouseDown(e,@))
mouseDown : (e,@) ->
    console.log(e,@)

但这会引发错误 unexpected PARAM_END

Answer 1

您似乎已经明白，您需要使用粗箭头 => 来在词法内部绑定(bind) this(又名 @)函数体。

class Board
  constructor: (@canvas) ->
  addEvent: ->
    @canvas.addEventListener 'mousedown', @mouseDown
  mouseDown: (event) =>       
    # handle the event here

为 mouseDown 方法使用粗箭头意味着 @ 在函数内部而不是在调用时按词法定义...所以它是 的实例您在代码中看到的类，而不是事件的接收者(DOM 元素)。

请注意，在 @ 之后不需要 . - 您可以编写 @canvas 而不是 @.canvas 。