情不知从何起,一往而情深
排名
6
文章
6
粉丝
16
评论
8
{{item.articleTitle}}
{{item.blogName}} : {{item.content}}
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2024TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
欢迎加群交流技术

layui简单树形组件,layui tree

9726人阅读 2020/6/18 9:04 总访问:745785 评论:0 收藏:0 手机
分类: 前端

html:

<div id="test" class="demo-tree-more"></div>

js:

     layui.use(['tree', 'util'], function () {
            var tree = layui.tree
            , layer = layui.layer
            , util = layui.util

           //模拟数据
          , data = [{
              title: '一级1'
            , id: 1
            , field: 'name1'
            , checked: true
            , spread: true
            , children: [{
                title: '二级1-1 可允许跳转'
              , id: 3
              , field: 'name11'
              , href: 'https://www.layui.com/'
            }]
          }, {
              title: '一级2'
            , id: 2
            , field: ''
            , spread: true
            , children: [{
                title: '二级2-1'
              , id: 5
              , field: ''
              , spread: true
            }, {
                title: '二级2-2'
              , id: 6
              , field: ''
            }]
          }]

            //基本演示
            tree.render({
                elem: '#test12'
              , data: data
              , showCheckbox: true  //是否显示复选框
              , id: 'demoId1'
              , isJump: true //是否允许点击节点时弹出新窗口跳转
              , click: function (obj) {
                  var data = obj.data;  //获取当前点击的节点数据
                  layer.msg('状态:' + obj.state + '<br>节点数据:' + JSON.stringify(data));
              }
            });

        });


欢迎加群讨论技术,群:677373950(满了,可以加,但通过不了),2群:656732739

评价