• layui配置


    layui是一个全局变量,可以在任何地方访问到
    layui.config 方法主配置信息(经测试好像不能添加额外属性)
    layui.setter读取主配置属性
    layui.extend 方法增加主配置模块
    layui.use 方法引用
    第一个参数(数组)用于加载模块,如果只有一个模块可以直接写字符串;
    第二个参数(方法)页面回调,增加页面自定义事件

    layui.config({
               base: '../layuiadmin/', //静态资源所在路径
           }).extend({
               index: 'lib/index', //主入口模块
           }).use(['index', 'forum', 'table'], function () {
               var $ = layui.$
               , form = layui.form
               , table = layui.table;
    });
    >>>layui.setter.base
    '../layuiadmin/'
    

      

    一个搜索按钮,一个表格:

    <button class="layui-btn layuiadmin-btn-replys" data-type="reload" lay-submit lay-filter="LAY-app-forumreply-search">
                                <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                            </button>
    
    <table id="LAY-app-forumreply-list" lay-filter="LAY-app-forumreply-list"></table>
    

      

    元素包含lay-submit,根据lay-filter的值来得到该按钮

    //得到元素所在layui-form中的表单数据
    form.on('submit(LAY-app-forumreply-search)', function (data) {
    //data.field表单中包含name属性的键值对象
                    var field = data.field;
    
                    //执行页面中 id="LAY-app-forumreply-list"的重载
                    table.reload('LAY-app-forumreply-list', {
    //where属性可以在异步请求中增加额外的参数
                        where: field
                    });
                });
    

      

    加载列表:

    table.render({
            elem: "#LAY-app-forumreply-list",
            url: "/Txooo/Sales/Mch/Product/Ajax/ProductAjax.ajax/GetProductList3",
            cols: [[{
    //多选框
                type: "checkbox",
                fixed: "left"
            },
            {
    //可排序的列sort
                field: "replytime",
                title: "回帖时间",
                sort: !0
            },
            {
    //读取模板加载列内容
                title: "操作",
                 150,
                align: "center",
                fixed: "right",
                toolbar: "#table-forum-replys"
            }]],
            page: 0,
            limit: 10,
            where: {
                pageIndex: 0,
                r_state: 5
            },
            limits: [10, 15, 20, 25, 30],
            text: "对不起,加载出现异常!",
            response: { dataName: "list" }
    })
    

      

    render 列表渲染
    elem 渲染目标id
    url 异步加载地址
    page 固定读取分页当前页
    limit 固定每页条数
    limits 可选每页条数
    response 请求参数配置{"statusName":"code","statusCode":0,"msgName":"msg","dataName":"data","countName":"count"}

    cols 列名与内容设置
    • type 内容类型
    • fixed 样式左右方向
    • field 对应的异步数据字段名称
    • title 展示的列名
    • sort 可排序字段
    • align 字体居中
    • toolbar 可操作模板id
    • templet 普通模板内容id或html代码




  • 相关阅读:
    vue改变了数据却没有自动刷新
    Unable to find vcvarsall.bat
    修改Linux用户配置之后先验证再退出
    平面最远点对
    [转]你可能不知道的五个强大HTML5 API
    sqlite3常用技巧
    使用rsync
    画图必备numpy函数
    np.percentile获取中位数、百分位数
    [转]numpy 100道练习题
  • 原文地址:https://www.cnblogs.com/ampl/p/10233930.html
Copyright © 2020-2023  润新知