Easyui TreeGrid树形表格返回json数据不显示问题

柔光的暖阳◎ 2022-05-23 03:57 255阅读 0赞

老规矩还是先上图看效果：

![70][]

这是正确的效果图差不多花了两天的时间去研究这个TreeGrid树形表格，错误原因就是 json 问题，先看返回的json数据：

\{  
    "menu": \[\{  
        "m\_id": 1,  
        "m\_name": "工作平台",  
        "m\_code": "001",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-television fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "menus": \[\{  
            "m\_id": 32,  
            "m\_name": "客户管理",  
            "m\_code": "",  
            "m\_childrenId": 1,  
            "m\_icon": "icon-group group",  
            "m\_url": "暂时空",  
            "m\_time": 1527748186000,  
            "m\_text": "客户管理",  
            "m\_sort": 1,  
            "m\_level": 0,  
            "m\_statu": 0,  
            "menus": \[\{  
                "m\_id": 36,  
                "m\_name": "测试一",  
                "m\_code": "",  
                "m\_childrenId": 32,  
                "m\_icon": "icon-cog",  
                "m\_url": "",  
                "m\_time": null,  
                "m\_text": "",  
                "m\_sort": 0,  
                "m\_level": 0,  
                "m\_statu": 0,  
                "menus": \[\]  
            \}, \{  
                "m\_id": 37,  
                "m\_name": "测试第二",  
                "m\_code": "",  
                "m\_childrenId": 32,  
                "m\_icon": "icon-cog",  
                "m\_url": "",  
                "m\_time": null,  
                "m\_text": "",  
                "m\_sort": 0,  
                "m\_level": 0,  
                "m\_statu": 0,  
                "menus": \[\]  
            \}\]  
        \}\]  
    \}, \{  
        "m\_id": 2,  
        "m\_name": "工具",  
        "m\_code": "002",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-cubes fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "menus": \[\{  
            "m\_id": 33,  
            "m\_name": "工作日志",  
            "m\_code": "",  
            "m\_childrenId": 2,  
            "m\_icon": "icon-building",  
            "m\_url": "暂空",  
            "m\_time": 1527748268000,  
            "m\_text": "工作日志描述",  
            "m\_sort": 2,  
            "m\_level": 0,  
            "m\_statu": 0,  
            "menus": \[\]  
        \}\]  
    \}, \{  
        "m\_id": 3,  
        "m\_name": "数据统计",  
        "m\_code": "003",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-bar-chart fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "menus": \[\{  
            "m\_id": 34,  
            "m\_name": "客户统计",  
            "m\_code": "",  
            "m\_childrenId": 3,  
            "m\_icon": "icon-chart-pie",  
            "m\_url": "暂空",  
            "m\_time": 1527748323000,  
            "m\_text": "客户统计",  
            "m\_sort": 3,  
            "m\_level": 0,  
            "m\_statu": 0,  
            "menus": \[\]  
        \}\]  
    \}, \{  
        "m\_id": 4,  
        "m\_name": "系统管理",  
        "m\_code": "004",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-cog fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "menus": \[\{  
            "m\_id": 35,  
            "m\_name": "系统管理",  
            "m\_code": "",  
            "m\_childrenId": 4,  
            "m\_icon": "icon-cog",  
            "m\_url": "暂空",  
            "m\_time": 1527748369000,  
            "m\_text": "系统管理描述",  
            "m\_sort": 4,  
            "m\_level": 0,  
            "m\_statu": 0,  
            "menus": \[\]  
        \}\]  
    \}, \{  
        "m\_id": 5,  
        "m\_name": "更多",  
        "m\_code": "005",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-list fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557192000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "menus": \[\]  
    \}\]

在这讲解一下easyui TreeGrid的返回json格式的要求（必须严格按照官方的json格式）：

（1）基本json数据格式：

\[  
    \{  
        "m\_id": 1,  
        "m\_name": "工作平台",  
        "m\_code": "001",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-television fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "children": \[  
            \{  
                "m\_id": 32,  
                "m\_name": "客户管理",  
                "m\_code": "",  
                "m\_childrenId": 1,  
                "m\_icon": "icon-group group",  
                "m\_url": "暂时空",  
                "m\_time": 1527748186000,  
                "m\_text": "客户管理",  
                "m\_sort": 1,  
                "m\_level": 0,  
                "m\_statu": 0,  
                "children": \[  
                    \{  
                        "m\_id": 36,  
                        "m\_name": "测试一",  
                        "m\_code": "",  
                        "m\_childrenId": 32,  
                        "m\_icon": "icon-cog",  
                        "m\_url": "",  
                        "m\_time": null,  
                        "m\_text": "",  
                        "m\_sort": 0,  
                        "m\_level": 0,  
                        "m\_statu": 0,  
                        "children": \[  
                              
                        \]  
                    \},  
                    \{  
                        "m\_id": 37,  
                        "m\_name": "测试第二",  
                        "m\_code": "",  
                        "m\_childrenId": 32,  
                        "m\_icon": "icon-cog",  
                        "m\_url": "",  
                        "m\_time": null,  
                        "m\_text": "",  
                        "m\_sort": 0,  
                        "m\_level": 0,  
                        "m\_statu": 0,  
                        "children": \[  
                              
                        \]  
                    \}  
                \]  
            \}  
        \]  
    \},  
    \{  
        "m\_id": 2,  
        "m\_name": "工具",  
        "m\_code": "002",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-cubes fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "children": \[  
            \{  
                "m\_id": 33,  
                "m\_name": "工作日志",  
                "m\_code": "",  
                "m\_childrenId": 2,  
                "m\_icon": "icon-building",  
                "m\_url": "暂空",  
                "m\_time": 1527748268000,  
                "m\_text": "工作日志描述",  
                "m\_sort": 2,  
                "m\_level": 0,  
                "m\_statu": 0,  
                "children": \[  
                      
                \]  
            \}  
        \]  
    \},  
    \{  
        "m\_id": 3,  
        "m\_name": "数据统计",  
        "m\_code": "003",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-bar-chart fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "children": \[  
            \{  
                "m\_id": 34,  
                "m\_name": "客户统计",  
                "m\_code": "",  
                "m\_childrenId": 3,  
                "m\_icon": "icon-chart-pie",  
                "m\_url": "暂空",  
                "m\_time": 1527748323000,  
                "m\_text": "客户统计",  
                "m\_sort": 3,  
                "m\_level": 0,  
                "m\_statu": 0,  
                "children": \[  
                      
                \]  
            \}  
        \]  
    \},  
    \{  
        "m\_id": 4,  
        "m\_name": "系统管理",  
        "m\_code": "004",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-cog fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "children": \[  
            \{  
                "m\_id": 35,  
                "m\_name": "系统管理",  
                "m\_code": "",  
                "m\_childrenId": 4,  
                "m\_icon": "icon-cog",  
                "m\_url": "暂空",  
                "m\_time": 1527748369000,  
                "m\_text": "系统管理描述",  
                "m\_sort": 4,  
                "m\_level": 0,  
                "m\_statu": 0,  
                "children": \[  
                      
                \]  
            \}  
        \]  
    \},  
    \{  
        "m\_id": 5,  
        "m\_name": "更多",  
        "m\_code": "005",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-list fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557192000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "children": \[  
              
        \]  
    \}

（2）带rows的数据格式（rows必须一致不能少擅自修改）

\{ "rows" :\[  
    \{  
        "m\_id": 1,  
        "m\_name": "工作平台",  
        "m\_code": "001",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-television fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "children": \[  
            \{  
                "m\_id": 32,  
                "m\_name": "客户管理",  
                "m\_code": "",  
                "m\_childrenId": 1,  
                "m\_icon": "icon-group group",  
                "m\_url": "暂时空",  
                "m\_time": 1527748186000,  
                "m\_text": "客户管理",  
                "m\_sort": 1,  
                "m\_level": 0,  
                "m\_statu": 0,  
                "children": \[  
                    \{  
                        "m\_id": 36,  
                        "m\_name": "测试一",  
                        "m\_code": "",  
                        "m\_childrenId": 32,  
                        "m\_icon": "icon-cog",  
                        "m\_url": "",  
                        "m\_time": null,  
                        "m\_text": "",  
                        "m\_sort": 0,  
                        "m\_level": 0,  
                        "m\_statu": 0,  
                        "children": \[  
                              
                        \]  
                    \},  
                    \{  
                        "m\_id": 37,  
                        "m\_name": "测试第二",  
                        "m\_code": "",  
                        "m\_childrenId": 32,  
                        "m\_icon": "icon-cog",  
                        "m\_url": "",  
                        "m\_time": null,  
                        "m\_text": "",  
                        "m\_sort": 0,  
                        "m\_level": 0,  
                        "m\_statu": 0,  
                        "children": \[  
                              
                        \]  
                    \}  
                \]  
            \}  
        \]  
    \},  
    \{  
        "m\_id": 2,  
        "m\_name": "工具",  
        "m\_code": "002",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-cubes fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "children": \[  
            \{  
                "m\_id": 33,  
                "m\_name": "工作日志",  
                "m\_code": "",  
                "m\_childrenId": 2,  
                "m\_icon": "icon-building",  
                "m\_url": "暂空",  
                "m\_time": 1527748268000,  
                "m\_text": "工作日志描述",  
                "m\_sort": 2,  
                "m\_level": 0,  
                "m\_statu": 0,  
                "children": \[  
                      
                \]  
            \}  
        \]  
    \},  
    \{  
        "m\_id": 3,  
        "m\_name": "数据统计",  
        "m\_code": "003",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-bar-chart fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "children": \[  
            \{  
                "m\_id": 34,  
                "m\_name": "客户统计",  
                "m\_code": "",  
                "m\_childrenId": 3,  
                "m\_icon": "icon-chart-pie",  
                "m\_url": "暂空",  
                "m\_time": 1527748323000,  
                "m\_text": "客户统计",  
                "m\_sort": 3,  
                "m\_level": 0,  
                "m\_statu": 0,  
                "children": \[  
                      
                \]  
            \}  
        \]  
    \},  
    \{  
        "m\_id": 4,  
        "m\_name": "系统管理",  
        "m\_code": "004",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-cog fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557191000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "children": \[  
            \{  
                "m\_id": 35,  
                "m\_name": "系统管理",  
                "m\_code": "",  
                "m\_childrenId": 4,  
                "m\_icon": "icon-cog",  
                "m\_url": "暂空",  
                "m\_time": 1527748369000,  
                "m\_text": "系统管理描述",  
                "m\_sort": 4,  
                "m\_level": 0,  
                "m\_statu": 0,  
                "children": \[  
                      
                \]  
            \}  
        \]  
    \},  
    \{  
        "m\_id": 5,  
        "m\_name": "更多",  
        "m\_code": "005",  
        "m\_childrenId": 0,  
        "m\_icon": "fa fa-list fa-2x",  
        "m\_url": "ww.baidu.com",  
        "m\_time": 1527557192000,  
        "m\_text": "",  
        "m\_sort": 0,  
        "m\_level": 0,  
        "m\_statu": 0,  
        "children": \[  
              
        \]  
    \}

\]\}

以上是官方要求的json 格式，我返回的json格式有两个bug 第一问题：menu必须是rows 第二问题：menus 必须是children ，

如果你是使用的第一种json数据格式那么menu对象干掉 menus改为children

如果你是用的第二种json格式那么menu必须是rows menus改为children

以上就是我遇到的问题，希望能给同学带来帮助 六一儿童节快乐！

[70]: /images/20220523/722670083e8d4f019341e961e207de35.png