> 文章列表 > 获取Tree 树形控件下面的全部id

获取Tree 树形控件下面的全部id

获取Tree 树形控件下面的全部id

一、建立一个Tree 树形控件

    <el-tree:data="state.treeData":props="state.Props"node-key="id":highlight-current="true":expand-on-click-node="true":filter-node-method="filterNode"@node-click = "clickTrees"ref="tree">

二、点击clickTrees方法

const clickTrees = function(data,node){state.expandedMedTreeKeys =[];const moduleDataList=[];moduleDataList.push(data);state.expandedMedTreeKeys = getAllNodeId(state.expandedMedTreeKeys,moduleDataList)console.log(state.expandedMedTreeKeys)
}

上面图中 state.expandedMedTreeKeys 就是存放获取到全部id的数组

三、循环获取id

const  getAllNodeId = function(MedicinalTreeKeys, moduleDataList) {for (var i = 0; i < moduleDataList.length; i++) {MedicinalTreeKeys.push(moduleDataList[i].id)if (moduleDataList[i].children) {MedicinalTreeKeys = getAllNodeId(MedicinalTreeKeys, moduleDataList[i].children)}}return MedicinalTreeKeys}

这样就可以获取到所有的id了,当然如果tree树的id,默认是id那就不用管,如果id是别的如appId等,可以通过绑定的数据来修改。图一中绑定的  :props="state.Props"

Props: {value: 'appId',children: 'childrenTree',label: 'appName'}, 

图一中的 node-key="id" 也改成 node-key="AppId"

把图三中对应的东西也改一下, MedicinalTreeKeys.push(moduleDataList[i].id)改成

 MedicinalTreeKeys.push(moduleDataList[i].AppId)moduleDataList[i].children 也改成 moduleDataList[i].childrenTree 等。