jsTree的基本使用方法以及按需装载子节点

本文主要内容：

一、jsTree的基本使用方法；

二、按需装载子节点，即每次展开某节点时，才去服务器装载其子节点。

jsTree是基于jQuery的一个树形插件，该项目主页：http://www.jstree.com/

本文使用版本为   jsTree - v3.3.2 - 2016-08-15 - (MIT)，主要参考文档在下载包里的documentation.html文件。

jsTree的基本使用方法：

一、 在页面导入必要的库文件

基本的使用只需要jquery.js和jquery.tree.js两个文件，都在jsTree的下载包里，不同版本的jsTree需要导入的库文件可能不同。

 

 

二、前端Html代码

         id="myTree">

   

三、 前端JS代码

四、后台   controller 中的代码

  public async Task GetFolder(string id)
        {
            GetPrivateFoldersInput input = new GetPrivateFoldersInput();
            if (id == "#")
            {
                input.ParentId = null;
            }
            else
            {
                input.ParentId = long.Parse(id);
            }
            JsonResult result = new JsonResult();
            result.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
            var list = await _folderAppService.GetPrivateFolders(input);
            var items = list.Items.Select(o => new TreeNode()
            {
                id = o.Id.ToString(),
                parent = o.ParentId == null ? "#" : o.ParentId.ToString(),
                text = "" + o.DisplayName + " (" + o.FileCount + ") ",
                children = o.ChildCount > 0 ? true : false
            }).ToList();

            result.Data = items;
         
            return result;
        }

五、JSTree 的节点发生变化后刷新节点

   $("#myTree").jstree('refresh');