layui table样式_layui table 分页

全栈程序员-用户IM • 2022年9月16日下午4:16 • 未分类

大家好，又见面了，我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元售后保障童叟无欺

table的结构：

<thead>

<tr>

<th lay-data=”{field:’a’, width:200}”>序号</th>

<th lay-data=”{field:’b’, width:150}”>登录账号</th>

<th lay-data=”{field:’c’, minWidth: 180}”>用户名</th>

<th lay-data=”{field:’d’, minWidth: 180}”>权限</th>

<th lay-data=”{field:’e’, minWidth: 180}”>操作</th>

</tr>

</thead>

<tbody>

<#if baseUserPageModel?? && baseUserPageModel.data??>

<#list baseUserPageModel.data as user>

<tr>

<td>${(user.id)!”}</td>

<td>${(user.userAccount!”)}</td>

<td>${(user.userName!”)}</td>

<td>${(user.roleName!”)}</td>

<td>

<a class=”layui-btn layui-btn-xs” class=”edit” οnclick=’editUser(${user.id})’ >编辑</a>

<a class=”layui-btn layui-btn-danger layui-btn-xs” class=”del” οnclick=’deleteUser(${user.id})’ >删除</a>

</td>

</tr>

</#list>

</#if>

</tbody>

</table>

使用layui渲染table

layui.use([‘common’,’table’,’jquery’], function(){

var common = layui.common;
var table = layui.table;
var $=layui.$;

var data={

table :{

id:’userlist-table’,
options:{
}
},
page :{
id:”page”,
fromId:”searchFrom”,
options:{
layout: [‘count’, ‘prev’, ‘page’, ‘next’, ‘limit’, ‘skip’],
first: ‘首页’,
last: ‘尾页’
}
}
};
common.filltable(data);
});