Vue.jsを2系にしたらdatepickerが動かなくなってしまったので困った話

今までVue.jsとbootstrap-datepickerを組み合わせて使ってました。
諸々の事情があってVue.jsを1系から2系にアップデータした結果、
テキストボックスをクリックしてもカレンダーが表示されない現象が発生しました。
対応方法をブックマーク的な感じで残しておきます。

↓が今までのソースコードの抜粋（そもそもこれが駄目な可能性があるのかな）

before.html

<input type="text" id="sampleDate" v-model="sampleDate">

before.coffee

new Vue
    el: '#sampleDiv'
    data:
        sampleDate: ''

calender.coffee

$(document).on 'ready page:load', () ->
    $('#sampleDate').datepicker

まずは結果から。

after.html

<input type="text" id="sampleDate" v-model="sampleDate">

after.coffee

new Vue
    el: '#sampleDiv'
    data:
        sampleDate: ''
    mounted: ->
        $('#sapleDiv').datepicker()
        .on 'changeDate', () =>
            this.sampleDate = $('#sampleDate').val()

色々と調べてみると、

• mountedに記載すること
• datepickerのchangeDateを使用すること

上記の２つを使用すると正常に動作するということにたどり着いたので、
そのように記載しました。

vue-datepickerなるものも存在するのですが、
諸々の事情でそちらは使用出来ませんでした＞＜；