layui表格 

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="./layui/css/layui.css">


</head>

<body>
  <table id="demoTreeTb"></table>
  <script src="./jquery/dist/jquery.js"></script>
  <script src="./layui/layui.js"></script>
  <script src="./treetable-lay/dist/treeTable.js"></script>
  <script>
    layui.config({
      base: './treetable-lay'
    }).use(['treeTable'], function () {
      var treeTable = layui.treeTable;

    });
    layui.use(['treeTable'], function () {
      var $ = layui.jquery;
      var treeTable = layui.treeTable;

      // 渲染树形表格
      var insTb = treeTable.render({
        elem: '#demoTreeTb',
        url: './main.json',
        tree: {
          iconIndex: 2,           // 折叠图标显示在第几列
          isPidData: true,        // 是否是id、pid形式数据
          idName: 'authorityId',  // id字段名称
          pidName: 'parentId'     // pid字段名称
        },
        cols: [[
          { type: 'numbers' },
          { type: 'checkbox' },
          { field: 'authorityName', title: '菜单名称' },
          { field: 'menuUrl', title: '菜单地址' },
          { field: 'authority', title: '权限标识' }
        ]]
      });

    });
  </script>
</body>

</html>

 layui地址:     https://www.layui.com/demo/table/operate.html

from和layui表格:https://blog.csdn.net/qq_26118603/article/details/80064173

 

*** from和layui表格*https://www.pianshen.com/article/3879356914/

posted @ 2020-12-16 01:20  缔造cool  阅读(185)  评论(0)  编辑  收藏  举报