欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

插件:ztree 数据格式 及 基本用法

程序员文章站 2024-02-16 09:00:40
...
ztree 官网:http://www.treejs.cn/v3/api.php

数据格式:

  1. JSON

    var nodes = [
    	{name: "父节点1", children: [
    		{name: "子节点1"},
    		{name: "子节点2"}
    	]}
    ];
    

2.pId 即 paraent-Id, 最顶上的 pid === 0
插件:ztree 数据格式 及 基本用法
效果:
插件:ztree 数据格式 及 基本用法

基本用法 (数据格式 2 ) :

```
api.allTreeData().then((res) => {
  res.data[0].open = true;   //第一个打开
   let setting = {
     view: {
       dblClickExpand: true,
       showLine: true,
       selectedMulti: false
     },
     data: {
       simpleData: {
         enable: true,  //显示层级
         idKey: "id",
         pIdKey: "pId",
         rootPId: 0
       }
     },
     callback: {
       onClick: function (event, treeId, treeNode) {
         _this.callBack(treeNode);
       }
     }
   };
   let zTree = $.fn.zTree.init($('#jg-tree'), setting, res.data);
   //默认选中 第一个
   let firstNode = zTree.getNodeByParam('id', 1);
   zTree.selectNode(firstNode);

})