结构最简单的el-tree使用, 经常用来显示机构,菜单,省市县等信息


<el-tree ref="tree" :data="treedata" :props="defaultProps2"></el-tree>

list: function(){
        u.axios.get("http://localhost:6088/treeList").then(function(res){
            console.log(res.data);
            //为什么用push
          quan.treedata.push(res.data);
        });
      }

后端, 使用正向递归查询

package com.bw.controller;

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import com.bw.entity.City;
import com.bw.entity.CityExample;
import com.bw.entity.CityExample.Criteria;
import com.bw.mapper.CityMapper;

@RestController
public class CityTreeController {
    @Autowired
    CityMapper cityMapper;
    
    /**
     * 
     * 难度系数在 ****
     * redisTemplate ***
     * @param city
     * @return
     */
    public City recur(City city){//city-->父节点
        CityExample cityExample=new CityExample();
        Criteria criteria = cityExample.createCriteria();
        criteria.andPidEqualTo(city.getCityid());//pid=
        List<City> children = cityMapper.selectByExample(cityExample);//select * from city
        for (City child : children) {
            this.recur(child);
        }
        city.setChild(children);
        return city;
    }
    
    
    @RequestMapping("treeList")
    public City treeList(){
        City city = cityMapper.selectByPrimaryKey(1);//1-->中国的节点
        city=this.recur(city);
        return city;
    }

}

数据库结构

1    中国    0
2    河北    1
3    河南    1
4    山东    1
5    邯郸    2
6    石家庄    2
7    郑州    3
8    洛阳    3
9    邯郸一街    5
10    邯郸二街    5

张泽
5 声望1 粉丝