export default { data() { return { tableData: [ { date: '2022-01-01', data: [ { name: '小红', age: 18, address: 'hf' }, { name: '小明', age: 20, address: 'nj' }, { name: '小华', age: 22, address: 'sh' } ] }, { date: '2022-01-02', data: [ { name: '小张', age: 25, address: 'sd' }, { name: '小德', age: 30, address: 'hn' }, { name: '小美', age: 28, address: 'sz' } ] }, { date: '2022-01-03', data: [ { name: '小英', age: 35, address: 'jdz' }, { name: '小澳', age: 40, address: 'yw' }, { name: '小法', age: 36, address: 'zjj' } ] } ], columns: [ { label: 'Name', prop: 'name', width: '80px' }, { label: 'Age', prop: 'age', width: '40px' }, { label: 'Address', prop: 'address' } ], headerCellStyle: { 'background-color': '#f5f7fa', 'text-align': 'center' } } } }
时间: 2024-04-27 18:24:42 浏览: 25
这是一个 Vue.js 组件中的数据对象,其中包含一个 tableData 数组和一个 columns 数组。tableData 数组中的每个元素包含一个日期和一个数据数组,数据数组中的每个元素包含一个人的姓名、年龄和地址。columns 数组中的每个元素包含一个列的标签、属性和宽度。
此外,还有一个 headerCellStyle 对象,用于设置表头单元格的样式。在这里,将表头单元格的背景颜色设置为浅灰色,并将文本居中对齐。
这段代码可能用于渲染一个表格,可以使用 Vue.js 的模板语法和组件进行渲染。具体的实现方法可以参考 Vue.js 的官方文档或相关教程。
阅读全文