版权声明:版权是个什么玩意儿?看得上随便转 https://blog.csdn.net/Byte_Dance/article/details/83246815
damo1.json
{
"code": 0,
"msg": "",
"count": 100,
"data": [
{
"id": 10000,
"username": "user-0",
"sex": "女",
"city": "昆明",
"sign": "签名-0"
},
{
"id": 10001,
"username": "user-1",
"sex": "男",
"city": "楚雄",
"sign": "签名-1"
},
{
"id": 10002,
"username": "user-2",
"sex": "女",
"city": "富源",
"sign": "签名-2"
},
{
"id": 10003,
"username": "user-3",
"sex": "女",
"city": "富源",
"sign": "签名-3"
},
{
"id": 10004,
"username": "user-4",
"sex": "男",
"city": "富源",
"sign": "签名-4"
},
{
"id": 10005,
"username": "user-5",
"sex": "女",
"city": "长沙",
"sign": "签名-5"
},
{
"id": 10006,
"username": "user-6",
"sex": "女",
"city": "桂林",
"sign": "签名-6"
},
{
"id": 10007,
"username": "user-7",
"sex": "男",
"city": "长春",
"sign": "签名-7"
}
]
}
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="layui/css/layui.css">
<!-- 注意:如果你直接复制所有代码到本地,上述css路径需要改成你本地的 -->
</head>
<body>
<table class="layui-table" lay-data="{url:'./demo1.json'}" >
<thead>
<tr>
<th lay-data="{type:'checkbox'}">ID</th>
<th lay-data="{field:'id', width:80, sort: true}">ID</th>
<th lay-data="{field:'username', width:120, sort: true, edit: 'text'}">用户名</th>
<th lay-data="{field:'email', edit: 'text', minWidth: 150}">邮箱</th>
<th lay-data="{field:'sex', width:80, edit: 'text'}">性别</th>
<th lay-data="{field:'city', edit: 'text', minWidth: 100}">城市</th>
<th lay-data="{field:'experience', sort: true, edit: 'text'}">积分</th>
</tr>
</thead>
</table>
<script src="layui/layui.js"></script>
<!-- 注意:如果你直接复制所有代码到本地,上述js路径需要改成你本地的 -->
<script>
layui.use('table');
</script>
</body>
</html>