最近修改:html
2020/07/16 感謝評論提醒,發現了代碼中的錯誤,修改內容:「row-style="height:80px"」 => 「:row-style="{height: '80px'}"」、「cell-style="padding:0"」 => 「:cell-style="{padding: '0'}"」code
Q(問題):elementUI自帶的table設置行高htm
A(解決方法):修改el-table元素中row-style屬性裏的heightblog
Example(示例):ip
默認:element
<template> <el-table :data="tableData" style="width: 100%" > <el-table-column prop="date" label="日期" width="180"> </el-table-column> <el-table-column prop="name" label="姓名" width="180"> </el-table-column> <el-table-column prop="address" label="地址"> </el-table-column> </el-table> </template> <script> export default { data() { return { tableData: [{ date: '2016-05-02', name: '王小虎', address: '上海市普陀區金沙江路 1518 弄' }, { date: '2016-05-04', name: '王小虎', address: '上海市普陀區金沙江路 1517 弄' }, { date: '2016-05-01', name: '王小虎', address: '上海市普陀區金沙江路 1519 弄' }, { date: '2016-05-03', name: '王小虎', address: '上海市普陀區金沙江路 1516 弄' }] } } } </script>
修改後:table
... <el-table :data="tableData" style="width: 100%" :row-style="{height: '80px'}" > ...
Q:能夠設置行高但低於必定值時再也不變化既行高存在最小值class
A:修改el-table元素中cell-style屬性裏的padding值date
Example:方法
height設爲0時行高存在最小值(由內容決定)
修改後
... <el-table :data="tableData" style="width: 100%" :row-style="{height: '0'}" :cell-style="{padding: '0'}" > ...