CoffeeScriptでファットアローを使用した場合のthisについて
3402 ワード
CoffeeScriptでファットアローを使用してthisコンテキストを維持した場合、イベントハンドラ内の関数にthisを引数として渡す方法がよく分からなかったので試してみました。
分かりづらい説明になってしまいましたので、ソースをご確認頂ければと思います。
hoge.coffee
class Hoge
constructor: ->
@button = document.getElementById 'button'
@attachEvent()
attachEvent: ->
@button.addEventListener 'click', => # ファットアローを使用してthisコンテキストを維持
@addClass(@) # クリックした要素を渡したいが、ここでの@はHogeを指しているため意図しない挙動になる
, false
addClass: (target) ->
target.className = 'is-active'
結局、下記のようにeventオブジェクトのcurrentTargetを渡してあげる事で解決しました。
hoge.coffee
class Hoge
constructor: ->
@button = document.getElementById 'button'
@attachEvent()
attachEvent: ->
@button.addEventListener 'click', (e) =>
@addClass(e.currentTarget) # これでクリックした要素を渡せた
, false
addClass: (target) ->
target.className = 'is-active'
Author And Source
この問題について(CoffeeScriptでファットアローを使用した場合のthisについて), 我々は、より多くの情報をここで見つけました https://qiita.com/ymdman/items/9dfcae8c298a1bfc98c2著者帰属：元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .