未知層級樹結構表格新增節點,新增子節點,刪除節點


用element+vue生成樹狀表格,實現刪除,新增一行?

el-table里邊有個屬性tree-props。具體的參照官網給出的描述:

支持樹類型的數據的顯示。當 row 中包含 children 字段時,被視為樹形數據。渲染樹形數據時,必須要指定 row-key。通過指定 row 中的 hasChildren 字段來指定哪些行是包含子節點。children 與 hasChildren 都可以通過 tree-props 配置。

如下圖。就是表格中的樹形結構刪除一行和新增一行。

 

直接上代碼:

html:

 

 js:增加一行,這個Id要是唯一的值,所以最好前端生成的時候用多位隨機碼,不建議用下圖中的,如果id后台處理就不用管了。

 

 刪除一行:

 

 

 刪除一行與新增一行就完成了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM