获取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 等。

猜你喜欢

转载自blog.csdn.net/guapilixianghe/article/details/130270370