标签：控件 title list pid content 树形 type id iview

<template>
 <div>
   <Tree :data="newlist" show-checkbox @on-check-change="choiceAll" ref="tree4">
   </Tree>
   <!-- <div>{{newlist}}</div> -->
 </div>
</template>

<script>
export default {
  data () {
    return {
		content:[	
			 {"id":1,"pid":0,"title":"默认维度","type":"0"},
			{"id":2,"pid":1,"title":"上海科技有限公司","type":"1"},
			{"id":3,"pid":2,"title":"北京科技有限公司","type":"1"},
			{"id":4,"pid":2,"title":"北京科技有限公司","type":"1"},
			{"id":117,"pid":4,"title":"测试部门","type":"2"},
			{"id":5,"pid":2,"title":"徐州科技有限公司","type":"1"},
			{"id":6,"pid":2,"title":"重庆科技有限公司","type":"1"},
			{"id":114,"pid":12,"title":"需求分析师","type":"3"},
			{"id":7,"pid":2,"title":"人力资源部","type":"2"},
			{"id":100,"pid":7,"title":"修改岗位测试3","type":"3"},
			{"id":101,"pid":7,"title":"添加岗位测试","type":"3"},
			{"id":102,"pid":7,"title":"添加岗位测试2","type":"3"},
			{"id":103,"pid":8,"title":"java开发","type":"3"},
			{"id":107,"pid":7,"title":"HR","type":"3"},
			{"id":8,"pid":2,"title":"产品研发部","type":"2"},
			{"id":10,"pid":8,"title":"统一岗位","type":"3"},
			{"id":9,"pid":2,"title":"销售部","type":"2"},
			{"id":108,"pid":9,"title":"销售顾问","type":"3"},
			{"id":11,"pid":2,"title":"深圳科技有限公司","type":"1"},
			{"id":12,"pid":2,"title":"咨询服务部","type":"2"},
			{"id":106,"pid":12,"title":"咨询顾问","type":"3"},
		],
		newlist:[]
    }
  },
  methods: {
	deepSort(list, content) {
	  var content1 = []
	  for (var m = 0; m < list.length; m++) {
		for (var n = 0; n < content.length; n++) {
		  if (list[m].id === content[n].pid) {
			list[m].children.push(content[n])
		  } else {
			content1.push(content[n])
		  }
		}
	  }
	  for (var o = 0; o < list.length; o++) {
		this.deepSort(list[o].children, content1)
	  }
	},
	choiceAll (data){
　　　　console.log(data);  //当复选框选中时则会打印出选中的内容
// 　　　　let choicesAll=this.$refs.tree4.getCheckedNodes; //方法的运用 getSelectedNodes也是如此用法
// 　　　　console.log(choicesAll); 
　　},
  },
  mounted () {
	for (var a = 0; a < this.content.length; a++) {		//给每条数据加上children属性
	  this.content[a].children = []
	}
	for (var b = 0; b < this.content.length; b++) {		//拿出最高层级的元素----pid数值最小则层级最高，此处直接取0，省去很多麻烦的数据操作
	   if (this.content[b].pid === 0) {
		  this.newlist = this.content.splice(b, 1)
	   }
	}
	this.deepSort(this.newlist, this.content)
  }
}
</script>

<style>

</style>

标签：控件,title,list,pid,content,树形,type,id,iview
来源： https://blog.csdn.net/qq_33221699/article/details/99288400

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。