构造最简略的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;@RestControllerpublic 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    中国    02    河北    13    河南    14    山东    15    邯郸    26    石家庄    27    郑州    38    洛阳    39    邯郸一街    510    邯郸二街    5