使用van-picker?動態(tài)設(shè)置當(dāng)前選中項
van-picker 動態(tài)設(shè)置當(dāng)前選中項
使用vant-field和van-picker、van-popup組合實現(xiàn)單選類型表單時，通常我們需要pick每次顯示時，默認(rèn)選中的是當(dāng)前有效值，但往往會出現(xiàn)這樣的情況
我們可以在沒法顯示picker的時候，動態(tài)設(shè)置當(dāng)前選中項，代碼示例如下
//pick中指定ref屬性為myPicker //currentIndex為當(dāng)前有效值對應(yīng)的索引值 this.$refs.myPicker.setColumnIndex(0, currentIndex)
setColumnIndex有兩個參數(shù)，第一個參數(shù)columnIndex代表的是列索引值，如果不涉及多列聯(lián)動，默認(rèn)為0；第二個參數(shù)optionIndex代表的要設(shè)置的有效索引值
van-picker 選擇器空白問題
van-picker綁定的數(shù)據(jù)實在store里，在store里數(shù)據(jù)格式也是正確的，但是到頁面里picker的選擇項就是全空白，
在該路由中將該組件的keepalive設(shè)為了true,所以從別的頁面回來的時候，picker綁定的數(shù)據(jù)不會重新獲取，而該組件在初始的created里將picker的數(shù)據(jù)項寫為了空數(shù)組，此時只需要在activated生命周期里重新給picker綁定的數(shù)據(jù)重新進(jìn)行取值操作即可。
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
Vue?nextTick獲取更新后的DOM的實現(xiàn)
本文主要介紹了Vue?nextTick獲取更新后的DOM的實現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-01-01
這篇文章主要介紹了vue.js中修飾符.stop的用法解析，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
這篇文章主要介紹了vue中倒計時組件的實例代碼,非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下2018-07-07
本篇文章給大家介紹了vue項目中API接口管理的相關(guān)知識點，以及相關(guān)JS代碼分析，有興趣的朋友參考下。2018-04-04
詳談vue+webpack解決css引用圖片打包后找不到資源文件的問題
下面小編就為大家分享一篇詳談vue+webpack解決css引用圖片打包后找不到資源文件的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03
vue.extend實現(xiàn)alert模態(tài)框彈窗組件
這篇文章主要為大家詳細(xì)介紹了vue.extend實現(xiàn)alert模態(tài)框彈窗組件，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-04-04
viewer.js用于圖片瀏覽的Vue組件,支持旋轉(zhuǎn)、縮放、翻轉(zhuǎn)等操作,這篇文章主要給大家介紹了關(guān)于vue3使用viewer的詳細(xì)用法,文中通過代碼介紹是非常詳細(xì),需要的朋友可以參考下2023-12-12
這篇文章主要介紹了手寫Vue彈窗Modal的實現(xiàn)代碼，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09
vue中el-table實現(xiàn)穿梭框(數(shù)據(jù)可以上移下移)
本文主要介紹了vue中el-table實現(xiàn)穿梭框(數(shù)據(jù)可以上移下移)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-06-06
vue如何給element-ui中的el-tabs動態(tài)設(shè)置label屬性
這篇文章主要介紹了vue如何給element-ui中的el-tabs動態(tài)設(shè)置label屬性，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-08-08