在咖啡脚本构造函数中绑定事件

Posted 2021-04-16

如果我上课了

class Control
  constructor: (@canvas, @control) ->
    @control.on('keyup change', ->
      update(@canvas)
    )

当我改变控制，更改事件被触发，我得到错误$canvas is undefined。

但是，如果代码更改为

class Control
  constructor: (canvas, @control) ->
    @control.on('keyup change', ->
      update(canvas)
    )

一切都按预期工作。

这是为什么？

答案

这按预期工作。在构造函数参数上使用@会自动在我们的构造函数中设置this.canvas = canvas。事件处理程序的上下文（this）与类不同，除非您使用“胖箭头”=>明确地将其范围限定。

class Control
  constructor: (@canvas, @control) ->
    @control.on('keyup change', => # notice fat arrow
      update(@canvas)
    )

在您的工作示例中，您通过不将canvas附加到当前上下文来避免此问题。