解決vue項(xiàng)目input輸入框雙向綁定數(shù)據(jù)不實(shí)時(shí)生效問題
我就廢話不多說了,大家還是直接看代碼吧~
<input type='text' maxlength='11' placeholder='請(qǐng)輸入聯(lián)系人電話' v-model='form.phone' />
這樣的輸入框,綁定的是data中的form對(duì)象上的phone字段。
在mounted鉤子函數(shù)里邊寫:
this.form.phone = ’1888888888’;
這樣在頁(yè)面上時(shí)候不會(huì)隨著輸入框值改變而改變。
解決方法如下:
this.$set(this.form,'phone',this.$route.query.mobile)
或者綁定到data里邊的一個(gè)字符串,也是可以解決的
補(bǔ)充知識(shí):vue模塊自動(dòng)化腳本編譯失敗module not found
vue的for循環(huán)改了key值出現(xiàn)了這樣的問題。
開始的寫法(沒出問題)
<div v-for='(item,index) in infos.visitStockReport' :key='index'>
(出問題的寫法)
<div v-for='(item) in infos.visitStockReport' :key='item.id'>
開始的寫法(沒出問題)
<div v-for='(bb,index2) in cc.content' :key='index2'>
(出問題的寫法)
<div v-for='(bb) in cc.content' :key='bb.contentName'>
解決方法:
1.可以把代碼回退到原來 的,只有控制臺(tái)waring,兩個(gè)循環(huán)都是以index為key,并不影響正常的編譯和運(yùn)行。
找到了真正的原因:
v-for='(bb) in cc.content'這種寫法的問題。
刪掉了index那么也不需要括號(hào)了。
改成v-for='bb in cc.content'就好了。
以上這篇解決vue項(xiàng)目input輸入框雙向綁定數(shù)據(jù)不實(shí)時(shí)生效問題就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. Spring如何集成ibatis項(xiàng)目并實(shí)現(xiàn)dao層基類封裝2. IDEA 2020.1.2 安裝教程附破解教程詳解3. idea設(shè)置提示不區(qū)分大小寫的方法4. 使用AJAX(包含正則表達(dá)式)驗(yàn)證用戶登錄的步驟5. 利用ajax+php實(shí)現(xiàn)商品價(jià)格計(jì)算6. IntelliJ IDEA導(dǎo)出項(xiàng)目的方法7. Java利用TCP協(xié)議實(shí)現(xiàn)客戶端與服務(wù)器通信(附通信源碼)8. Java PreparedStatement用法詳解9. django queryset相加和篩選教程10. JS圖片懶加載庫(kù)VueLazyLoad詳解

網(wǎng)公網(wǎng)安備