経緯

Vue.js を Rails のフロントとして使用した場合に RailsHelper と組み合わせると若干記述が複雑になったため備忘録として残しておく

実際のコード(html テンプレートエンジンは slim を使用)

  • 通常 a タグ
a.btn.home href="#{root_path}" @touchStart="onTouchStartForBtn" @touchEnd="onTouchEndForBtn" @touchmove="onTouchMoveForBtn"
  • RailsHelper での a タグ

Vue.js の bind を'(シングルコート)で括る

= link_to national_rankings_path, class: 'btn ranking', '@touchStart': "onTouchStartForBtn", '@touchEnd': "onTouchEndForBtn", '@touchmove': "onTouchMoveForBtn"