使用jstree某些树形节点不显示

港控/mmm° 2022-06-03 06:45 492阅读 0赞

使用jstree构建 系统-菜单-按钮 树时，本来是想呈现这样的效果：  
![这里写图片描述][SouthEast]

结果第一层节点打开后，子节点不显示了，点击一下，所有节点全没了，页面和后台也没有报错，实在是太诡异了。

因为是后台串json串到前台，所以我在控制台打印了一下传输的数据：

[
                    {
                        "id": "1",
                        "text": "权限认证系统",
                        "children": [
                            {
                                "id": "1",
                                "text": "用户管理",
                                "children": [
                                    {
                                        "id": "1",
                                        "text": "测试1"
                                    }
                                ]
                            },
                            {
                                "id": "2",
                                "text": "角色管理",
                                "children": [
                                    {
                                        "id": "2",
                                        "text": "测试2"
                                    }
                                ]
                            },
                            {
                                "id": "3",
                                "text": "字典管理",
                                "children": [
                                    {
                                        "id": "3",
                                        "text": "测试3"
                                    }
                                ]
                            },
                            {
                                "id": "4",
                                "text": "系统管理",
                                "children": [
                                    {
                                        "id": "4",
                                        "text": "测试4"
                                    }
                                ],
                            }
                        ]
                    }
                ];

完全符合json的格式，后来我改了字段顺序，改了引号，都没有用。最后发现是因为id重复了，原本以为同一个层的节点id不重复就可以了，但是发现所有的节点的id都不能重复。不同层的节点加个前缀，问题就解决了。

顺便说一下：jstree 只能识别 id、text、children等名称组成的json串。

[SouthEast]: /images/20220603/1ce42a7e76be476ab661b9f0ff06029c.png