Element?plus?表單中下拉框的空值問題解決
問題:在表單中,有時候會碰到查詢條件需要用下拉框來區(qū)分的時候,比如需要區(qū)分全部 | 啟用 | 停用三個狀態(tài),這時一般會給全部的value值設置為'',但是這樣會導致下拉框無法選中對應的全部選項。


注:這里已經(jīng)正確的配置了querFormData對應的值為'',但是仍然無法正確的顯示默認值為全部

解決:在el-select上有個屬性empty-values,值是一個數(shù)組,用來表明哪些值是空值,即被認為是沒選中狀態(tài)的值,默認是['', null, undefined],我們可以自行配置為[ null, undefined],這樣空值會被選中為全部


此外,element plus提供了Config Provider 來提供全局的配置選項,讓你的配置能夠在全局都能夠被訪問到。
在組件的外層套一個Config Provider,也可以實現(xiàn)該效果。但請注意,這個組件會讓其包裹的所有組件都應用這個選項,要根據(jù)業(yè)務需求來進行取舍。
更多信息可以參照Element Plus官方文檔的Config Provider。

到此這篇關(guān)于Element plus 表單中下拉框的空值問題解決的文章就介紹到這了,更多相關(guān)Element plus下拉框空值內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Vue3+Element Plus項目中使用html2canvas截圖方式
這篇文章主要介紹了Vue3+Element Plus項目中使用html2canvas截圖方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2026-03-03
解決vue-cli webpack打包開啟Gzip 報錯問題
這篇文章主要介紹了vue-cli webpack打包開啟Gzip 報錯問題的解決方法,本文給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下2019-07-07
vue3中使用v-model實現(xiàn)父子組件數(shù)據(jù)同步的三種方案
這篇文章主要介紹了vue3中使用v-model實現(xiàn)父子組件數(shù)據(jù)同步的三種方案,如果只有一個匿名v-model的傳遞的話,可以使用vue3.3新添加的編譯宏,defineModel來使用,每種方案結(jié)合示例代碼給大家介紹的非常詳細,需要的朋友可以參考下2023-10-10
element vue validate驗證名稱重復 輸入框與后臺重復驗證 特殊字符 字符長度 及注意事項小結(jié)【實例代碼
這篇文章主要介紹了element vue validate驗證名稱重復 輸入框與后臺重復驗證 特殊字符 字符長度 及注意事項小結(jié),本文通過實例代碼給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下2018-11-11

