vue在外部方法給下拉框賦值后不顯示label的解決
更新時(shí)間：2023年10月13日 14:41:24 作者：煎餅果子就咖啡
這篇文章主要介紹了vue在外部方法給下拉框賦值后不顯示label的解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
vue在外部方法給下拉框賦值后不顯示label
遇到一個(gè)問(wèn)題，我在外部方法中給下拉框賦值以后顯示的是value值，正常應(yīng)該顯示label
原代碼如下
在此處給性別賦值了
現(xiàn)象如下
排查后發(fā)現(xiàn)在此處應(yīng)該是給字符串而不是數(shù)字
修改后正常
vue下拉框選中不顯示的問(wèn)題
上圖：
說(shuō)明
糾結(jié)的事情就是：這種情況出現(xiàn)了很多次，每次都排查很久。
出現(xiàn)的情況
- 在幾級(jí)聯(lián)動(dòng)需要使用到el-select組件。
- 在添加的時(shí)候沒(méi)有出現(xiàn)這樣的問(wèn)題，但是在修改的時(shí)候很容易出現(xiàn)。
特別是講將 form.a 賦值給form.b這就會(huì)出現(xiàn)一種情況，form.a的改變老是影響form.b
對(duì)比
錯(cuò)誤的代碼：
var resp = response.data; this.form = resp; this.form.cityId = resp.cityName; this.form.provinceId = resp.provinceName;
本來(lái)的response的data里面有cityId的值和provinceId的值， 但是我們又重新的賦值了一次。
改正之后的代碼：
var resp = response.data; // 此處解決選擇市之后不展示label的情況 this.form.cityId = resp.cityName; this.form.provinceId = resp.provinceName; this.form.id = resp.id; this.form.bankName = resp.bankName; this.form.branchName = resp.branchName; this.form.branchId = resp.branchId; this.form.bankCode = resp.bankCode;
總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Vue監(jiān)聽(tīng)使用方法和過(guò)濾器實(shí)現(xiàn)
這篇文章主要介紹了Vue監(jiān)聽(tīng)使用方法和過(guò)濾器實(shí)現(xiàn)，過(guò)濾器為頁(yè)面中數(shù)據(jù)進(jìn)行強(qiáng)化，具有局部過(guò)濾器和全局過(guò)濾器2022-06-06
Vue3?中的?readonly?特性及函數(shù)使用詳解
readonly是Vue3中提供的一個(gè)新特性，用于將一個(gè)響應(yīng)式對(duì)象變成只讀對(duì)象，這篇文章主要介紹了Vue3?中的?readonly?特性詳解,需要的朋友可以參考下2023-04-04
Vue3之列表動(dòng)畫(huà)和狀態(tài)動(dòng)畫(huà)示例詳解
這篇文章主要為大家介紹了Vue3之列表動(dòng)畫(huà)和狀態(tài)動(dòng)畫(huà)示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-04-04
vue3+arco design通過(guò)動(dòng)態(tài)表單方式實(shí)現(xiàn)自定義篩選功能
這篇文章主要介紹了vue3+arco design通過(guò)動(dòng)態(tài)表單方式實(shí)現(xiàn)自定義篩選,本文主要實(shí)現(xiàn)通過(guò)動(dòng)態(tài)表單的方式實(shí)現(xiàn)自定義篩選的功能,用戶可以自己添加篩選的項(xiàng)目,篩選條件及篩選內(nèi)容,需要的朋友可以參考下2024-05-05
vue實(shí)現(xiàn)文字橫向無(wú)縫走馬燈組件效果的實(shí)例代碼
這篇文章主要介紹了vue 文字橫向無(wú)縫走馬燈組件的實(shí)現(xiàn)代碼，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-04-04
vue頁(yè)面跳轉(zhuǎn)實(shí)現(xiàn)頁(yè)面緩存操作
這篇文章主要介紹了vue頁(yè)面跳轉(zhuǎn)實(shí)現(xiàn)頁(yè)面緩存操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-07-07
本文主要介紹了vue樣式穿透的幾種方式，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-06-06
本文主要介紹了vue 面包屑導(dǎo)航組件封裝，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-07-07
Vue如何實(shí)現(xiàn)打包資源按時(shí)間戳方式
這篇文章主要介紹了Vue如何實(shí)現(xiàn)打包資源按時(shí)間戳方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-05-05
本篇文章主要介紹了詳解Vue 全局引入bass.scss 處理方案，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-03-03