jQuery Masked Input и vue модальное окно с input

Есть два input в vue модальном окне

<input type="text" v-model="number_phone" id="phone" name="phone" class="form-control" placeholder="Номер телефона" value="">
<input type="text" v-model.trim="lastname" class="form-control" name="lastname" placeholder="Отчество" value="">

vue компонент:

Vue.component('modal', {
    delimiters: ['{', '}'],
    template: '#modal-template',
    data: function(){
        return {
            lastname: '',
            number_phone: ''
        };
    },
    mounted:function(){
      $("#phone").mask("99/99/9999");
    }
})

$("#phone").mask("99/99/9999"); Это плагин jQuery Masked Input и он работает...

Только когда ввел данные в input number_phone а потом кликнул на input lastname и начал печатать в input number_phone пропадают все введенный ранее данные (поле становится пустым) Что я делаю не так?