Ztree实现增删改查

1.和另一篇文章--[TreeGrid 实现增删改查]前面的内容一致，只需要创建一个html页面，命名为ztree-01.html，粘贴如下网址的代码进入ztree-01.html。

访问http://www.treejs.cn/v3/faq.php#_206复制这些代码

2.在ztree-01.html做如图所示修改

第一步:引入所需的css样式和js

第二步:修改代码，如图所示：

说明：访问http://www.treejs.cn/v3/faq.php#_206，点击demo
可以看到左面菜单栏里有最简单的树选项，点击第一个--最简单的树 -- 标准JSON数据，如图所示

3.第三步:第一个既然不是我们要找的格式，就查看第二个 最简单的树 -- 简单JSON数据，如图所示

4.第四步：访问访问http://www.treejs.cn/v3/faq.p...，点击上方的API文档，找到data里面的simpleData，参考下图查找到这里

4-1复制这块的代码进入html页面

3.在html页面把如下没用的代码删除掉

------删除掉这些代码--------
var zNodes = [
   {name:"test1", open:true, children:[
      {name:"test1_1"}, {name:"test1_2"}]},
   {name:"test2", open:true, children:[
      {name:"test2_1"}, {name:"test2_2"}]}
   ];

在var settting里添加如下代码：

data:{
    simpleData:{
        enable:true,
        idKey:"id",
        pIdKey:"parentId",
        rootPId:null
 }
}

如图所示：

4.在function做如下修改

$(document).ready(function () {

let url="http://localhost:8080/category/doFindCategorys";
$.get(url,function (result) {
    console.log(result);
    zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, result);
})

});
修改后的代码如图所示

页面运行效果如图所示：