layui是一個(gè)全局變量搔扁,可以在任何地方訪問(wèn)到
layui.config 方法主配置信息(經(jīng)測(cè)試好像不能添加額外屬性)
layui.setter讀取主配置屬性
layui.extend 方法增加主配置模塊
layui.use 方法引用
第一個(gè)參數(shù)(數(shù)組)用于加載模塊柿汛,如果只有一個(gè)模塊可以直接寫(xiě)字符串腻格;
第二個(gè)參數(shù)(方法)頁(yè)面回調(diào)鼠哥,增加頁(yè)面自定義事件
layui.config({
base: '../layuiadmin/', //靜態(tài)資源所在路徑
}).extend({
index: 'lib/index', //主入口模塊
}).use(['index', 'forum', 'table'], function () {
var $ = layui.$
, form = layui.form
, table = layui.table;
});
>>>layui.setter.base
'../layuiadmin/'
一個(gè)搜索按鈕誓篱,一個(gè)表格:
<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焰络,根據(jù)lay-filter的值來(lái)得到該按鈕
//得到元素所在layui-form中的表單數(shù)據(jù)
form.on('submit(LAY-app-forumreply-search)', function (data) {
//data.field表單中包含name屬性的鍵值對(duì)象
var field = data.field;
//執(zhí)行頁(yè)面中 id="LAY-app-forumreply-list"的重載
table.reload('LAY-app-forumreply-list', {
//where屬性可以在異步請(qǐng)求中增加額外的參數(shù)
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: "回帖時(shí)間",
sort: !0
},
{
//讀取模板加載列內(nèi)容
title: "操作",
width: 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: "對(duì)不起鸥滨,加載出現(xiàn)異常嗦哆!",
response: { dataName: "list" }
})
render 列表渲染
elem 渲染目標(biāo)id
url 異步加載地址
page 固定讀取分頁(yè)當(dāng)前頁(yè)
limit 固定每頁(yè)條數(shù)
limits 可選每頁(yè)條數(shù)
response 請(qǐng)求參數(shù)配置{"statusName":"code","statusCode":0,"msgName":"msg","dataName":"data","countName":"count"}
cols 列名與內(nèi)容設(shè)置
- type 內(nèi)容類型
- fixed 樣式左右方向
- field 對(duì)應(yīng)的異步數(shù)據(jù)字段名稱
- title 展示的列名
- sort 可排序字段
- align 字體居中
- toolbar 可操作模板id
- templet 普通模板內(nèi)容id或html代碼