Vuejsでイベントリスナーが削除できなかったのはこういう理由か

できなかったこと

• 登録したイベントリスナーが削除できていなかった

原因

• 登録したイベントリスナーと別のイベントリスナーを削除していたから

詳細

• イベントを以下のように登録した

mounted: {
  document.addEventListener('scroll', this.scroll, {
    capture: true
  })
}

• イベントを以下のように削除していた

destroyed: {
  document.removeEventListener('scroll', this.scroll)
}

こうすべき

• イベントを以下のように登録したら

mounted: {
  document.addEventListener('scroll', this.scroll, {
    capture: true
  })
}

• イベントを以下のように削除すべき

destroyed: {
  document.removeEventListener('scroll', this.scroll, {
    capture: true
  })
}

補足

• イベントを削除せずに、同じ名前で登録したら処理は上書きされない
  • つまり、同じイベントで複数の処理が追加で実行されるようになる