layui table 动态分配宽度 怎么获取
时间: 2024-04-08 19:10:28 浏览: 12
如果要动态分配Layui表格的列宽,可以通过以下步骤获取列宽:
1. 获取表格实例
```
var table = layui.table;
```
2. 监听表格渲染完成的事件,并在事件回调函数中获取列宽
```
table.on('renderComplete(test)', function (res) {
var cols = res.cols[0];
var widthArr = [];
for (var i = 0; i < cols.length; i++) {
widthArr.push(cols[i].width);
}
console.log('列宽数组:', widthArr);
});
```
其中,`test` 是表格的 lay-filter 属性值,在监听事件时需要将其替换成实际的值。
3. 在表格的 cols 属性中设置宽度为 null 或者不设置宽度,让表格自动根据列内容计算宽度。
```
cols: [
{field: 'id', title: 'ID', width: null},
{field: 'username', title: '用户名', width: null},
{field: 'email', title: '邮箱', width: null},
{field: 'sex', title: '性别', width: null},
{field: 'city', title: '城市', width: null},
{field: 'sign', title: '签名', width: null},
{field: 'experience', title: '积分', width: null},
{field: 'score', title: '评分', width: null},
{field: 'classify', title: '职业', width: null},
{field: 'wealth', title: '财富', width: null}
]
```