原

使用递归算法，递归解析树形结构

12342人阅读 2020/1/10 18:06 总访问：378195 评论：1 收藏：0 手机

分类: .NET Core

在我们做权限管理的树形分布是，前台用的layui 框架，由于当时我们的树形层次只有两级。
试问，假如我们的层次有几十或上百的级的时候，难道我们也用那么多foreach循环吗？显然不科学。
今天我们就用看上去简单，却很实用的递归算法，解析树形结构。
一,新建一个.net core 的mvc项目

新建好项目后，不能像以前一样直接在新建项中添加ef了，需要用命令在添加ef的依赖

注意：所以依赖注入的命令不要放在项目里，要选择放入自己需要生成数据的类库里。

二,需要使用工具的Nuget包管理器添加EF的依赖。
Install-Package Microsoft.EntityFrameworkCore.SqlServer -version 2.1.0
三.如果是使用db first模型,需要根据数据库生成model，就还需要使用命令添加两个依赖
Install-Package Microsoft.EntityFrameworkCore.Tools -version 2.1.0 
Install-Package Microsoft.EntityFrameworkCore.SqlServer.Design
四.相关依赖注入成功之后，就可以再根据一个命令从数据库生成model了
Scaffold-DbContext "Server=.;Database=mydb;Trusted_Connection=True;" Microsoft.EntityFrameworkCore.SqlServer -OutputDir Models
注意：这里的Database=数据库的名称

五.生成数据之后，新建一个tree控制器，实现递归解析

权限sqlserver数据库的层级数据如下：
1，在项目自身的models里新建一个TreeModel类：
namespace WebAppTree.Models
{
    public class TreeModel
    {
        public string id { get; set; }
        public string title { get; set; }
        public List<TreeModel> children = new List<TreeModel>();
    }
}
2，在tree控制器封装一个递归的方法(需传递三个参数)，代码如下：
/// <summary>
        /// 递归函数
        /// </summary>
        public void ParseTree(List<Department> departmentList, List<TreeModel> treeModels,int?  parentId)
        {
            //找当前层级下级（如果ParentId==null 就是第一级）
            List<Department> Result= departmentList.Where(a => a.ParentId == parentId).ToList();
            foreach (Department item in Result)
            {
                TreeModel treeModel = new TreeModel();
                treeModel.id = item.Id;
                treeModel.title = item.DepartmentName;
                treeModels.Add(treeModel);
                //递归
                ParseTree(departmentList,treeModel.children,Convert.ToInt32(treeModel.id));
            }
        }
3，get请求，封装一个返回json数据的方法，代码如下：
[HttpGet]
        public JsonResult GetTreeData()
        {
            mydbContext mydbContexts = new mydbContext();
            List<Department> departmentList = mydbContexts.Department.ToList();
            List<TreeModel> treeModels = new List<TreeModel>();
            ParseTree(departmentList,treeModels,null);
            return Json(treeModels);
        }
4，调试项目的该方法，返回了数据，就说明得到递归方法解析数据成功。

5，现在我们在tree/index，使用layui框架，调用数据，解析明确的树形结构
官网下载layui插件之后，放在wwwroot的lib目录下。

前台调用js，css等，在layui官网复制树形结构图代码，如下；
@{
    ViewData["Title"] = "Index";
}
<link href="~/lib/layui/css/layui.css" rel="stylesheet" />
<script src="~/lib/layui/layui.js"></script>
<script src="~/lib/jquery/dist/jquery.js"></script>
<div id="test12" class="demo-tree-more" style="margin-top:60px;"></div>
<script>
    layui.use(['tree', 'util'], function () {
        var tree = layui.tree
            , layer = layui.layer
            , util = layui.util
        $.get('/tree/GetTreeData', function (data) {
     
        //基本演示
        tree.render({
            elem: '#test12'
            , data: data
            , showCheckbox: true  //是否显示复选框
            , id: 'demoId1'
            , isJump: true //是否允许点击节点时弹出新窗口跳转
            , click: function (obj) {
                var data = obj.data;  //获取当前点击的节点数据
                layer.msg('状态：' + obj.state + '<br>节点数据：' + JSON.stringify(data));
            }
            });
        })
    });
</script>
6，绑定数据之后，我们就运行该视图，就可以看到树形解析的层级关系了。

现在大家可以在数据库添加一条特殊按摩节点下的一条数据，然后刷新页面，就会逐层展开下级啦。

由于我这里数据提前添加了的，所以截图上已经存在该数据，喜欢的朋友可以自己测试哦。
喜欢的话可以加收藏哇，