vue下使用select2，綁定資料問題

在select元素上應用v-model綁定資料，本來沒啥問題，後來應用了select2優化樣式，發現v-model不管用了。

html部分：

<select id="deviceTypeAdd" name="deviceTypeAdd" v-model="deviceTypeAdd" type="text" class="span3">
     <option value="-1">請選擇報廢裝置類型</option>
     <option v-for="(key, value) in deviceType" value="{{key}}">{{value}}</option>
</select>
           

select元素應用select2：

$('select').select2();
           

在浏覽器看了下select2把元素渲染了成這樣，怪不得綁定不了

解決

//選擇的值綁定到全局變量
$("#deviceTypeAdd").on('change', function (e) {
   this.deviceTypeAdd = e.val;
});

//select標明某個預設值
watch: {
    deviceTypeAdd: function (val) {
       $("#deviceTypeAdd").select2('val', val);
    }
}