解決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';
這樣在頁面上時(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 class="record-info" v-for="(bb,index2) in cc.content" :key="index2">
（出問題的寫法）
<div class="record-info" 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è)參考，也希望大家多多支持腳本之家。
相關(guān)文章
在Web應(yīng)用程序中剪貼板(Clipboard)操作是非常常見的操作之一,這篇文章主要給大家介紹了關(guān)于vue中粘貼板clipboard使用方法的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-11-11
這篇文章主要介紹了vue-route路由管理的安裝與配置,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-07-07
這篇文章主要介紹了詳解Vue串聯(lián)過濾器的使用場(chǎng)景，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-04-04
本篇文章主要介紹了深入理解Vue 的條件渲染和列表渲染，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-09-09
Vue中的 mixins 和 provide/inject詳解
這篇文章主要介紹了Vue中的 mixins 和 provide/inject詳解,本文結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-07-07
這篇文章主要為大家詳細(xì)介紹了Vue3中使用富文本編輯器的相關(guān)知識(shí),文中的示例代碼講解詳細(xì),具有一定的學(xué)習(xí)價(jià)值,感興趣的小伙伴可以參考一下2023-10-10
vue2更改data里的變量不生效時(shí),深層更改data里的變量問題
這篇文章主要介紹了vue2更改data里的變量不生效時(shí),深層更改data里的變量問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
分享一個(gè)精簡(jiǎn)的vue.js 圖片lazyload插件實(shí)例
本篇文章主要介紹了分享一個(gè)精簡(jiǎn)的vue.js 圖片lazyload插件實(shí)例。非常具有實(shí)用價(jià)值，需要的朋友可以參考下。2017-03-03
vue路由跳轉(zhuǎn)到新頁面實(shí)現(xiàn)置頂
這篇文章主要介紹了vue路由跳轉(zhuǎn)到新頁面實(shí)現(xiàn)置頂問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-05-05
這篇文章主要介紹了Vue.js組件，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04