vue页面
<template>
<div>
<table style="width: 100%" class="myTable">
<tr v-for="(item,i) in tableData" :key="i">
<td class="column" align='left'>{{ item.key }}</td>
<td class="column">{{ item.value }}</td>
</tr>
</table>
</div>
</template>
要展示的数据
tableData: [
{key: '名称', value: '1001'},
{key: '工称', value: '篮球'},
{key: '编号', value: '120.00'},
]
表格样式
<style scoped>
.myTable {
border-collapse: collapse;
margin: 0 auto;
text-align: center;
}
.myTable td,
.myTable th {
border: 1px solid #cad9ea;
color: #666;
height: 35px;
}
</style>
效果图
名称 | 1001 |
工称 | 篮球 |
编号 | 120.00 |