Cxbocs 2021-12-14 16:40 采纳率: 0%
浏览 172
已结题

layui 使用treeTable2.x版本时,没有任何效果

layui 使用treeTable2.x版本时,没有任何效果,也无任何报错
html代码如下,引入layui.js,treeTable:

```html
<head>
    <title>权限列表</title>
    <link rel="stylesheet" href="${pageContext.servletContext.contextPath}/css/font.css">
    <link rel="stylesheet" href="${pageContext.servletContext.contextPath}/css/xadmin.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/md.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/lay/modules/treeTable/treeTable.css">
    <script src="${pageContext.request.contextPath}/layui/layui.js" ></script>
    <script src="${pageContext.request.contextPath}/js/jquery-3.5.1.min.js"></script>
</head>
<body class="layui-layout-body md-scroll" style="background-color: white">

    <div class="layui-container">
        <table id="auth-table" class="layui-table" lay-filter="auth-table"></table>
    </div>
</body>


js代码如下:

console.log(1);
    layui.config({
        base: '${pageContext.request.contextPath}/layui/lay/modules/'
    }).extend({
        treeTable: 'treeTable/treeTable'
    });

    layui.use(['treeTable'], function () {
        var treeTable = layui.treeTable;
        var renderTable = function(data) {
            console.log(0);

            treeTable.render({
                elem: '#auth-table',   // table容器
                cols: [             // 列配置
                    {type: 'numbers'},
                    {field: 'menuId',title: '权限id',hide:true},
                    {field: 'menuName', minWidth: 100, title: '权限名称'},
                    {field: 'URL', title: '菜单url'},
                    {field: 'isMenu', width: 80, align: 'center', templet: function (d) {
                            if (d.isMenu == 1) {
                                return '<span class="layui-badge-rim">菜单</span>';
                            }
                            if (d.parentId == 0) {
                                return '<span class="layui-badge layui-bg-blue">目录</span>';
                            } else {
                                return '<span class="layui-badge layui-bg-gray">按钮</span>';
                            }
                        }, title: '类型'},
                    {templet: '#auth-state', width: 120, align: 'center', title: '操作'}
                ],
                reqData: function(data, callback) {// 异步加载数据的方法
                    var pid = data?data.menuId:0;
                    $.post({
                        url :'${pageContext.request.contextPath }/sysMenu/menulist',
                        data:{
                            pid:pid
                        },
                        dataType:'json',
                        success:function(data){
                            callback(res.data);
                        }
                    });
                },
                tree: {
                    idName: 'menuId',  // id的字段名
                    pidName: 'pid',  // pid的字段名
                    //childName: 'children',  // children的字段名
                    haveChildName: 'haveChild',  // 是否有children标识的字段名
                    openName: 'open',  // 是否默认展开的字段名
                    isPidData: true,  // 是否是pid形式的数据
                    iconIndex: 1,  // 图标列的索引
                    arrowType: undefined,  // 箭头类型
                    onlyIconControl: false,  // 仅允许点击图标折叠
                }
            });
    });


运行结果:

img

一开始报错信息为 layui.init: treeTable is not a valid modules,
我在head标签中引入treeTable.js之后就没有任何反应,之后我就又把treeTable.js的引入去除之后,就一直没有任何效果
请问是什么原因
  • 写回答

1条回答 默认 最新

  • 有问必答小助手 2021-12-16 09:36
    关注

    你好,我是有问必答小助手,非常抱歉,本次您提出的有问必答问题,技术专家团超时未为您做出解答


    本次提问扣除的有问必答次数,将会以问答VIP体验卡(1次有问必答机会、商城购买实体图书享受95折优惠)的形式为您补发到账户。


    因为有问必答VIP体验卡有效期仅有1天,您在需要使用的时候【私信】联系我,我会为您补发。

    评论

报告相同问题?

问题事件

  • 系统已结题 12月22日
  • 创建了问题 12月14日

悬赏问题

  • ¥15 itunes恢复数据最后一步发生错误
  • ¥15 关于#windows#的问题:2024年5月15日的win11更新后资源管理器没有地址栏了顶部的地址栏和文件搜索都消失了
  • ¥15 看一下OPENMV原理图有没有错误
  • ¥100 H5网页如何调用微信扫一扫功能?
  • ¥15 讲解电路图,付费求解
  • ¥15 有偿请教计算电磁学的问题涉及到空间中时域UTD和FDTD算法结合的
  • ¥15 vite打包后,页面出现h.createElement is not a function,但本地运行正常
  • ¥15 Java,消息推送配置
  • ¥15 Java计划序号重编制功能,此功能会对所有序号重新排序,排序后不改变前后置关系。
  • ¥15 关于哈夫曼树应用得到一些问题