tree結構方法可以參考elementui官網方法。 我這邊已經封裝了tree的方法,這塊部分略!這裡目的是選中父類如何遍歷子類的方法。
封裝的my-tree.vue
略!!!
可參考這個元件,自己封裝
引用:封裝的vue的tree
>然後就實現checkchange選中checkedbox的方法,先上**後講解(注意看備註)。
checkchange(data, node)else
},
上面呼叫遞迴方法
setchildrenchecked(node, ischecked)
for (let child of node.children)
},setparentchecked(node)
/* 這個是選中孫類(南山區),父類被選中(深圳),第一級不被選中(廣東)
let allsamelevel = true; // 判斷所有同級是否和當前狀態一樣
for (let samelevel of node.parent.children)
}if (!allsamelevel)
*/node.parent.checked = true;
this.setparentchecked(node.parent);
},setparentuncheck(node)
/* 孫節點取消(南山區),子節點跟著取消(深圳),父節點沒有取消(廣東)
let allsamelevel = false;
for (let samelevel of node.parent.children)
}if (!allsamelevel)
*/node.parent.checked = false;
this.setparentuncheck(node.parent);
},
以上**已經實現,驗證可以。
tree結構大概如下(本地即廣東省):
vue 使用window的物件 Vue構造選項
記憶體圖 new vue 就是構造乙個例項 物件 這個例項會根據你給的選項得出乙個物件,我們把這個物件命名為vm 把vue的例項命名為vm是尤雨溪的習慣,我們應該沿用 vm物件封裝了對檢視的所有操作,包括資料讀寫 事件繫結 dom更新 vm的建構函式是vue,按照es6的說法,vm所屬的類是vue ...
vue實現全選全不選
全選功能可以說是前端開發中非常常見的乙個功能,以前的專案開發用jquery開發比較多。最近在使用vue前端框架重構之前的專案。從jquery到vue的轉變主要是乙個思想想的轉變,是將原有的直接操作dom的思想轉變到運算元據,用資料驅動dom,也是vue框架的乙個核心思想,思想轉變過來,對功能的實現自...
vue實現全選 反選功能
用vue寫業務 時候,後端大神丟給我一堆資料,要求是做全選,反選功能,然後把使用者更改的資料全部返回給他 基本思路 如果父級選中了,那麼父級下面的子集全部選中checked true 如果子集中選中了乙個,那麼父級應該被勾選中 如果子集乙個都沒有選中,那麼父級此時應該沒有選中 最後提交使用者改變後的...