問題:
代碼片段:
<template><el-table :data="tableData" stripe style="width: 100%"><el-table-column prop="title" label="標題" width="80px" /><el-table-column prop="name" label="內容" width="80px" /><el-table-column prop="address" label="發布人" width="80px" /><el-table-column prop="date" label="發布時間" width="100px" /><el-table-column label="操作" width="200px"><template #default="scope"><el-button type="primary" size="small" @click="handleEdit(scope.row)">編輯</el-button><el-button type="danger" size="small" @click="handleDelete(scope.row)">刪除</el-button></template></el-table-column></el-table>
</template>
解決問題:
1.添加 <el-table-column/>
<template><el-table :data="tableData" stripe style="width: 100%"><el-table-column /><el-table-column prop="title" label="標題" width="80px" /><el-table-column prop="name" label="內容" width="80px" /><el-table-column prop="address" label="發布人" width="80px" /><el-table-column prop="date" label="發布時間" width="100px" /><el-table-column label="操作" width="200px"><template #default="scope"><el-button type="primary" size="small" @click="handleEdit(scope.row)">編輯</el-button><el-button type="danger" size="small" @click="handleDelete(scope.row)">刪除</el-button></template></el-table-column></el-table>
</template>
效果:
2.給table添加:display: table-cell;
效果: