columns 里面设置列的宽度
时间: 2023-10-01 20:05:41 浏览: 106
在 layui 中,可以通过设置 `cols` 属性来设置表格的列的宽度。`cols` 属性是一个二维数组,其中每个子数组表示一行,子数组中的元素表示该行中的每一列。每个元素可以是一个字符串,也可以是一个对象,对象中可以设置 `field`、`title`、`minWidth` 等属性,其中 `minWidth` 属性用于设置该列的最小宽度。具体示例如下:
```javascript
var myCols = [
[
{ field: 'id', title: 'ID', minWidth: 80 },
{ field: 'username', title: '用户名', minWidth: 120 },
{ field: 'sex', title: '性别', minWidth: 80 },
{ field: 'city', title: '城市', minWidth: 100 },
{ field: 'sign', title: '签名', minWidth: 120 },
{ field: 'experience', title: '积分', minWidth: 80 },
{ field: 'score', title: '评分', minWidth: 80 },
{ field: 'classify', title: '职业', minWidth: 100 },
{ field: 'wealth', title: '财富', minWidth: 100 }
]
];
```
在上述示例中,每列的最小宽度都被设置成了一个固定值,这样可以保证每列的宽度不会过小,同时也不会过大导致表格显示异常。你可以根据实际情况调整每列的宽度。在实际使用中,你可以将 `myCols` 作为 `cols` 属性的值传递给 layui 表格实例,如下所示:
```javascript
layui.use('table', function() {
var table = layui.table;
table.render({
elem: '#myTable',
cols: myCols,
// ... 其他属性
});
});
```
通过以上设置,你就可以在 layui 表格中设置列的宽度了。