vue錯誤筆記——vue使用boostrap的datepicker 資料無法繫結與無法提交(二)
阿新 • • 發佈:2019-02-18
在上一篇中,使用vue.set解決了問題,但只是向後臺提交資料時StartTime與EndTime兩個欄位有值,當修改其他欄位,觸發v-model重新繫結資料時,StartTime與EndTime兩個欄位的值又消失了,並沒有很好的解決問題。
我又在網上找了另一種方法,(ps:原部落格地址找不了)通過隱藏datetimepicker 的同時繫結資料,解決了消失的問題,原理還沒理解清楚,暫且先把程式碼放上來。
var editVM = new Vue({ el: "#Edit_VM", data:{ activity: { StartTime: '', EndTime: '', }, }, methods: { setDateTime: function () { $("#StartTime").datetimepicker({ autoclose: true, todayBtn:true, todayHighLight: true, language: 'zh-CN' }); $("#EndTime").datetimepicker({ autoclose: true, todayBtn: true, todayHighLight: true, language: 'zh-CN' }); //隱藏的同時繫結資料 $("#StartTime").datetimepicker().on('hide', function (ev) { var startTime = $("#StartTime").val(); _self.StartTime = startTime; }); $("#EndTime").datetimepicker().on('hide', function (ev) { var endTime = $("#EndTime").val(); _self.EndTime = endTime; }); } }