vue-treeselect顯示unknown的問題及解決
vue-treeselect顯示unknown問題
解決辦法一
官方上面綁定的value是不能為空的，要寫成null才不會(huì)出現(xiàn)
解決辦法二
這個(gè)方法簡單粗暴~
直接修改去你這個(gè)node-modules包里面找到這個(gè)組件的源碼，在它dist文件里面找到這個(gè)文件
搜索unknown，把它干掉，完美解決
vue-treeselect中的小tip
1.設(shè)置選中當(dāng)前節(jié)點(diǎn)不默認(rèn)選中父節(jié)點(diǎn)和子節(jié)點(diǎn)：
flat:true
參考資料：https://vue-treeselect.js.org/#flat-mode-and-sort-values
2.選中了分支節(jié)點(diǎn)及其所有后代
則vue-treeselect會(huì)將它們組合到值數(shù)組中的單個(gè)項(xiàng)目中，可以通過 valueConsistsOf 來更改：
ALL: 選中的所有節(jié)點(diǎn)都將包含在 value 數(shù)組中BRANCH_PRIORITY(默認(rèn)): 如果選中了分支節(jié)點(diǎn)，則其所有后代將被排除在 value 數(shù)組之外LEAF_PRIORITY: 如果選中了分支節(jié)點(diǎn)，則此節(jié)點(diǎn)本身及其分支后代將從value 陣列中排除，但其葉后代將包括在內(nèi)ALL_WITH_INDETERMINATE: 選中的任何節(jié)點(diǎn)將包括在 value 數(shù)組中，另外還有不確定的節(jié)點(diǎn)
參考資料：https://vue-treeselect.js.org/#prevent-value-combining
3.需要禁用父節(jié)點(diǎn)，但是子節(jié)點(diǎn)是可選的，需要使用：
:flat="true",必須和多選配合使用 :multiple="true" 但是需要單選怎么辦：
綁定 input 事件，然后在事件中處理:
inputTreeValue(nodes) {
? ? ? ? ? if (Array.isArray(nodes)) {
? ? ? ? ? ? const len = nodes.length;
? ? ? ? ? ? const lastNode = nodes[len - 1];
? ? ? ? ? ? this.value = lastNode ? [lastNode] : [];
? ? ? ? ? } else {
? ? ? ? ? ? this.value = null;
? ? ? ? ? }
? ? ? ? }參考資料：https://github.com/riophae/vue-treeselect/issues/145
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue3頁面query參數(shù)變化并重新加載頁面數(shù)據(jù)方式
在Web開發(fā)中,頁面間的跳轉(zhuǎn)及數(shù)據(jù)刷新是常見問題,通過使用$router.push和$router.replace方法,可以控制頁面跳轉(zhuǎn)的行為,具體操作時(shí),若發(fā)現(xiàn)頁面ID變更后數(shù)據(jù)未刷新,可通過給router-view標(biāo)簽添加key值解決,若使用keep-alive2024-10-10
Vue?3.0?v-for中的Ref數(shù)組用法小結(jié)
在?Vue?2?中,在?v-for?里使用的?ref?attribute會(huì)用ref?數(shù)組填充相應(yīng)的?$refs?property,本文給大家介紹Vue?3.0?v-for中的Ref數(shù)組的相關(guān)知識(shí),感興趣的朋友一起看看吧2023-12-12
前后端分離進(jìn)行項(xiàng)目開發(fā),跨域問題不可避免,下面這篇文章主要給大家介紹了關(guān)于vue中前端代理跨域問題的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-04-04
vue mint-ui學(xué)習(xí)筆記之picker的使用
本篇文章主要介紹了vue mint-ui學(xué)習(xí)筆記之picker的使用，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-10-10
這篇文章主要介紹了Vue插件之滑動(dòng)驗(yàn)證碼用法,結(jié)合實(shí)例形式詳細(xì)分析了Vue滑動(dòng)驗(yàn)證碼插件相關(guān)使用方法與操作注意事項(xiàng),需要的朋友可以參考下2020-04-04
vue中el-cascader三級(jí)聯(lián)動(dòng)懶加載回顯問題解決
本文主要介紹了vue中el-cascader三級(jí)聯(lián)動(dòng)懶加載回顯問題解決，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-06-06
Vue3-新特性defineOptions和defineModel示例詳解
在Vue3.3中新引入了defineOptions宏主要是用來定義Option API的選項(xiàng),可以用defineOptions定義任意的選項(xiàng),props、emits、expose、slots除外,本文給大家介紹Vue3-新特性defineOptions和defineModel,感興趣的朋友一起看看吧2023-11-11
3分鐘了解vue數(shù)據(jù)劫持的原理實(shí)現(xiàn)
這篇文章主要介紹了3分鐘了解vue數(shù)據(jù)劫持的原理實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
VueJS 組件參數(shù)名命名與組件屬性轉(zhuǎn)化問題
這篇文章主要介紹了VueJS 組件參數(shù)名命名與組件屬性轉(zhuǎn)化問題，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-12-12
vue 監(jiān)聽窗口變化對(duì)頁面部分元素重新渲染操作
這篇文章主要介紹了vue 監(jiān)聽窗口變化對(duì)頁面部分元素重新渲染操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-07-07