vue?el-date-picker?日期回顯后無法改變問題解決
場景描述:點擊修改,數(shù)據(jù)回顯渲染,后端返回我的是startTime和endTime,我需要將其處理,放到一個數(shù)組里面,并將其賦值
后端返回數(shù)據(jù)
<el-form-item label="適用時間" prop="time1"> <el-date-picker v-model="form.time1" type="datetimerange" style="width: 380px" :default-time="['00:00:00', '23:59:59']" range-separator="至" value-format="yyyy-MM-dd HH:mm:ss" :picker-options="expireTimeOPtion" @change="beginDateChange" start-placeholder="開始日期" end-placeholder="結(jié)束日期"> </el-date-picker> </el-form-item>
handleUpdate(row) { this.reset(); const id = row.id || this.ids var array=[] getfuelRates(id).then(response => { this.form = response.data; array.push(response.data.startTime,response.data.endTime) this.form.time1=array this.open = true; this.title = "修改"; }); },
這樣寫,就會出現(xiàn)問題,數(shù)據(jù)回顯成功之后,無法改變,如下圖
解決方法:
handleUpdate(row) { this.reset(); const id = row.id || this.ids var array=[] getfuelRates(id).then(response => { this.form = response.data; array.push(response.data.startTime,response.data.endTime) this.$set(this.form,'time1',array); this.form.time1=array this.open = true; this.title = "修改"; }); },
或者
handleUpdate(row) { this.reset(); const id = row.id || this.ids getfuelRates(id).then(response => { this.form = response.data; this.$set(this.form,'time1',[response.data.startTime,response.data.endTime]); this.form.time1=array this.open = true; this.title = "修改燃油附加費"; }); },
重點代碼:
this.$set(this.form,'time1',XXX);
以上就能實現(xiàn),如下圖
到此這篇關(guān)于vue el-date-picker 日期回顯后無法改變的文章就介紹到這了,更多相關(guān)vue el-date-picker 日期回顯內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
詳解解決使用axios發(fā)送json后臺接收不到的問題
這篇文章主要介紹了詳解解決使用axios發(fā)送json后臺接收不到的問題,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-06-06vue+webpack 打包文件 404 頁面空白的解決方法
下面小編就為大家分享一篇vue+webpack 打包文件 404 頁面空白的解決方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-02-02使用vue-cli創(chuàng)建項目并webpack打包的操作方法
本文給大家分享使用vue-cli創(chuàng)建項目基于webpack模板打包的配置方法,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友參考下吧2021-07-07用 Vue.js 遞歸組件實現(xiàn)可折疊的樹形菜單(demo)
通過本文給您演示一下如何有效地使用遞歸組件,我將通過建立一個可擴展/收縮的樹形菜單的來一步步進行。下面通過本文給大家分享用 Vue.js 遞歸組件實現(xiàn)可折疊的樹形菜單,需要的朋友參考下吧2017-12-12vue的.vue文件是怎么run起來的(vue-loader)
通過vue-loader,解析.vue文件,在webpack解析,拆解vue組件 ,本文通過實例代碼給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友參考下2018-12-12vue3使用el-radio-group獲取表格數(shù)據(jù)無法選中問題及解決方法
這篇文章主要介紹了vue3使用el-radio-group獲取表格數(shù)據(jù)無法選中問題及解決方法,本文給大家介紹的非常詳細,需要的朋友可以參考下2024-05-05vue實現(xiàn)導(dǎo)航欄效果(選中狀態(tài)刷新不消失)
這篇文章主要為大家詳細介紹了vue實現(xiàn)導(dǎo)航欄效果,選中狀態(tài)刷新不消失,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-12-12