本文摘自PHP中文网,作者尚,侵删。

在用layui的时候,要把整个lib文件引到项目中,然后在页面上引入layui.css和layui.js文件。
在用到layui中内置模块的时候,用layui.use去引用:
1 2 3 4 | layui. use ([ 'layer' , 'table], function (){
var layer = layui.layer;
var table = layui.table;
})
|
关于layer的用法,直接看官方文档就好了。在这里,我只记录一下自己平常用到的,又不好找的。
1.在用table方法渲染的时候,有时候前端需要加自增序号,那么怎么加呢?
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | table.render({
elem: '#dataTable' ,
url: "getDataOrderList" ,
page:{
count : 'count' ,
limit:20
},
cols: [[
{type: 'numbers' ,title: '序号' ,align: 'center' },
{field: 'order_no' , title: '订单编号' },
{field: 'tel' , title: '购买账号' },
{field: 'total_price' , title: '服务金额' ,color: "red" },
{field: 'pay_time' , title: '支付时间' },
{title: '服务有效期' ,toolbar: '#detail' },
{field: 'buy_by' , title: '开通方式' }
]]
});
|
还有一个问题,就是有操作怎么办?像查看,编辑等?在以上的render方法中有个服务有效期这个字段,其中有个属性交toolbar他的属性值是html中的代码:
1 2 3 4 5 | <table class = "layui-table" id= "dataTable" lay-filter= "dataTable" ></table>
script type= "text/html" id= "detail" >
<a href= "javascript:;" style= "color: #468aff" lay-event= "detail" >查看详情</a>
</script>
|
更多layui知识请关注layui使用教程栏目。
以上就是layui中的table方法渲染的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
jquery的easyui和layui区别是什么
layui怎么关闭当前弹窗
layui不支持ie兼容吗
layui中进度条渲染介绍
layui怎么隐藏表格行
layui表单元素怎么校验
layui的优缺点是什么?
在layui的laydate组件中添加设置一周开始的方法
layui怎么设置checkbox勾选
layui属于什么
更多相关阅读请进入《layui》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » layui中的table方法渲染