LayUI treetable树形表格的实现， 数据格式正确，不显示的解决方案 和在这个过程中遇到的坑~ 认真看 你会得到一些想要的答案。

先给大家看下效果吧！ 我这边只是针对数据显示的问题做了解释。并没有增删改查。找增删改查的同学可以不用看了。

做出这样的效果，首先我们要借用LayUI的内置插件，treetable.js 网上有很多，之前看一个文档里说LayUI不自带这个插件，其实是有的。。。可能他没下载对。

—网上百度的用的基本都是这2个文件。

但其实LAYUI下载下来的插件里面其实是有的。可能之前没有，最近更新就有了吧~我用的是他自身的，但其实都一样，我大概看了2个JS文件，写的类容都一样，也都可以实现树形表格的功能。（PS：说这个就是想说网上那么多人都非得单独下载treetable-lay这个插件。。其实没必要，因为官方已经有了，我用得就是官方。虽然2个都一样）

下面是我用的官网写的treetable.js文件

好了 废话不多说了 插件搞来了 直接上代码！下面是主题

首先是需要引用得东西。给大家看下我得。必须引用得是layui.css和layui.JS不然没效果

然后是页面代码！就是一个table

然后JS代码 我相信初用得同学们并不清楚JS里面的代码各个的含义，以及对应的关系，这里我将详细介绍

先看代码

上面JS代码部分 ，重点讲解
treeSpi
treeIdName
treePidName

首先是最大的坑treeSpi 你这个值写错，你数据就会出不来！这个属性的意思，就是父级ID，就是一级菜单的ID ，你数据库里面传过来的一级PID是多少，你就得写多少，比如你得一级PID是0 那么你就得写0，当然，我数据库PID用的类型是uniqueidentifier，所有传过来的ID是那些十六进制的玩意。但只要你对应，他就会显示出来，这个坑坑了我2天（一直数据传过来了 ，但就是不显示！！！那么就是你这个ID写错了！！！）

**切忌。PID值不能为null ，插件不识别。**往后看我后台代码。

接着就是 treeIdName这个就是你数据库里面的id字段.

treePidName* 这个就是数据库的pid字段。

上面首坑就是treeSpi ，应该说的 很明白了吧，有还搞不出来的可以留言。

好了上面就是我JS所遇到的坑~

接着是我的后台代码

        public ActionResult SysInfo()
        {

            var list = (from s in db.SystemResourceModule
               
                        select new
                        {
                            id = s.Id,
                            Name = s.Name,
                            Code = s.Code,
                            Url = s.Url,
                            Type = s.Type,
                            //如果等于空值  就给父级一个ID  ，否则就让PID=PID
                            pid = s.ParentId == null ? new Guid("{e10ce31c-124c-4398-b118-1d5bf6dd39f3}") : s.ParentId,
                 
                           
                        }).ToList();



       

            return Json(new { code = 0, mgs = "success", count = list.Count(), data = list.OrderBy(s =>s.id) }, JsonRequestBehavior.AllowGet);
        }

后台要注意的就是，如果你数据出不来，显示无数据，那就是你格式错了。我最开始理解错了，我以为后台需要自己先把父级，和子级菜单先自己分出来，然后再传值。。。结果我理解错了，我分出后然后传过去，格式的确和官网要求的树形格式一样！！！但是，，，你用的treetable.js别人不接收你分好的树形格式呀，，，，，他只接收你查出来一张表的所有数据，（无奈的我后台写了一天的树格式。。。结果人家还不接收。。。。） 然后那个JS文件，自动帮你分级！！！！！！