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

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
    在这里插入图片描述
    效果:
    在这里插入图片描述

基本用法 (数据格式 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);

 })
```
发布了48 篇原创文章 · 获赞 6 · 访问量 7万+

猜你喜欢

转载自blog.csdn.net/github_36327470/article/details/86623690
今日推荐