利用递归把扁平数据转化成树形数据
This commit is contained in:
		
							parent
							
								
									8736d78b1f
								
							
						
					
					
						commit
						387e18059d
					
				
							
								
								
									
										16
									
								
								src/utils/list-to-treedata.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										16
									
								
								src/utils/list-to-treedata.js
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,16 @@
 | 
			
		||||
export function listToTreeData(list, currentPid) {
 | 
			
		||||
  const res = []
 | 
			
		||||
  list.forEach(item => {
 | 
			
		||||
    if (item.pid === currentPid) {
 | 
			
		||||
      // 对于找出来的子节点, 都要再找它的下一级
 | 
			
		||||
      // 把当前的item.id 作为下一层的 pid
 | 
			
		||||
      const children = listToTreeData(list, item.id)
 | 
			
		||||
      // 什么时候停止, 找不到下一级的时候停止
 | 
			
		||||
      if (children.length > 0) {
 | 
			
		||||
        item.children = children
 | 
			
		||||
      }
 | 
			
		||||
      res.push(item)
 | 
			
		||||
    }
 | 
			
		||||
  })
 | 
			
		||||
  return res
 | 
			
		||||
}
 | 
			
		||||
@ -18,6 +18,7 @@
 | 
			
		||||
<script>
 | 
			
		||||
import treeTools from './componets/tree-tools.vue'
 | 
			
		||||
import { getDepartments } from '@/api/departments'
 | 
			
		||||
import { listToTreeData } from '@/utils/list-to-treedata'
 | 
			
		||||
export default {
 | 
			
		||||
  components: { treeTools },
 | 
			
		||||
  data() {
 | 
			
		||||
@ -33,7 +34,8 @@ export default {
 | 
			
		||||
  async created() {
 | 
			
		||||
    const res = await getDepartments()
 | 
			
		||||
    console.log(res)
 | 
			
		||||
    this.departs = res.depts
 | 
			
		||||
    this.departs = [...listToTreeData(res.depts, '')]
 | 
			
		||||
    console.log(this.departs)
 | 
			
		||||
    this.company = {
 | 
			
		||||
      name: 'xx股份有限公司' || res.companyName,
 | 
			
		||||
      manager: '负责人'
 | 
			
		||||
@ -43,9 +45,15 @@ export default {
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped>
 | 
			
		||||
<style>
 | 
			
		||||
.tree-card {
 | 
			
		||||
  padding: 30px  140px;
 | 
			
		||||
  font-size:14px;
 | 
			
		||||
}
 | 
			
		||||
.is-leaf{
 | 
			
		||||
  visibility:hidden;
 | 
			
		||||
}
 | 
			
		||||
.el-icon-arrow-down{
 | 
			
		||||
  display: none;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user