jQueryを使用して、スムーズスクロールをVue.jsの構文で書く。

Vue.jsのアプリの中にjQueryを共存させる方法です。

jQuery単体よりもスッキリして見やすくなったのではないかと思われます

vueのon:clickでscrollメソッドを呼び出し
scrollの(e)でスクロールする場所を指定しています。

HTML

 <div id="app">
  <a href="#" on:click="scroll('#a')">a</a>       
  <a href="#" on:click="scroll('#b')">b</a>       
  <a href="#" on:click="scroll('#c')">c</a>       
   <div id="a">
   </div>
  <div id="b">
   </div>
  <div id="c">
   </div>
 </div>

Javascript

var app = new Vue({
    el: '#app',
    data: {
    },
    methods: {
        scroll: function(e) {
            $("html,body").animate({
                scrollTop: $(e).offset().top
            }, 500)
        return false;
        }
    }
});