1

単純なCoffeeScriptクラスを作成していますが、次のコードでコンテキストの問題が発生しています。

class DragDrop
constructor: (@selector, @bodyDragEnterClass = "drag-over") ->
    @attachEventHandlers()

attachEventHandlers: () ->
    document.write(@bodyDragEnterClass) # this line tells me, that @bodyDragEnterClass is "drag-over"
    document.addEventListener("dragenter", @onDragEnter, false)

onDragEnter: () ->
    document.write(@bodyDragEnterClass) # this line tells me, that @bodyDragEnterClass is undefined
    jQuery("body").addClass(@bodyDragEnterClass)

window.DragDrop = DragDrop

attachEventHandlersメソッドが呼び出されると、期待@bodyDragEnterClassどおりに「ドラッグオーバー」に設定されます。ただし、dragenterイベントがトリガーされ、onDragEnterメソッドが呼び出されると、@bodyDragEnterClassは「未定義」になります。

ここでコンテキストの問題を示すためにjsfiddleを作成しました：http：//jsfiddle.net/SVvrM/

この問題を解決するにはどうすればよいですか？

4

1 に答える 1

2

CoffeeScriptの「太い矢」の典型的なケースがあります。

this別のコンテキストで実行されるコールバック内でDragDrop値にアクセスする必要があります。太い矢印を使用すると、の現在の値が関数にバインドthisされます。onDragEnter

# "fat arrow" function binding
onDragEnter: () =>
  document.write(@bodyDragEnterClass) # this line tells me, that @bodyDragEnterClass is undefined
  jQuery("body").addClass(@bodyDragEnterClass)
于 2013-02-13T23:04:16.610 に答える