layui表格如何接收一个对象里边定义的另一个对象的集合数据
时间: 2023-07-19 11:07:22 浏览: 132
layui数据表格重载实现往后台传参
在 layui 表格中,我们可以通过数据渲染的方式来实现展示一个对象里边定义的另一个对象的集合数据。具体的实现步骤如下:
1. 定义表格的列属性,其中包含需要展示的对象属性。
```javascript
var cols = [[
{field: 'id', title: 'ID'},
{field: 'name', title: 'Name'},
{field: 'age', title: 'Age'},
{field: 'address.city', title: 'City'},
{field: 'address.country', title: 'Country'},
]];
```
2. 定义表格的数据,其中包含需要展示的对象数据。
```javascript
var data = [
{id: 1, name: 'John', age: 25, address: {city: 'New York', country: 'USA'}},
{id: 2, name: 'Mary', age: 30, address: {city: 'London', country: 'UK'}},
{id: 3, name: 'Tom', age: 35, address: {city: 'Paris', country: 'France'}}
];
```
3. 使用 layui 表格的 render 方法渲染数据。
```javascript
layui.use('table', function(){
var table = layui.table;
table.render({
elem: '#test',
cols: cols,
data: data
});
});
```
在上述代码中,我们使用了 `address.city` 和 `address.country` 来展示对象里边定义的另一个对象的集合数据。这样就可以在 layui 表格中展示一个对象里边定义的另一个对象的集合数据了。
阅读全文