1.el-table-column不設置width與minwidth,每一列自適應,寬度一致
2.el-table-column設置width=30%,無效。
el-table 組件會被 vue 解析成 html, width 設置百分比的值直接被解析去掉百分號變成 px 了
3.el-table-column設置min-width="30"或者30%,每一列都設置min-width才能實現每一列的百分比配置
<el-table :data="tableList" v-loading="loading" :header-cell-style="{background:'#eef1f6',color:'#606266'}" highlight-current-row > <el-table-column label="序號" type="index" min-width="5%" align="center"></el-table-column> <el-table-column prop="xxxx" label="xxxx" align="left" min-width="25%"></el-table-column> <el-table-column prop="xxxx" label="xxxx" align="center" :formatter="formatTd" min-width="12%"></el-table-column> <el-table-column prop="xxxx" label="xxxx" align="center" :formatter="formatTd" min-width="20%"></el-table-column> <el-table-column label="xxxx" align="center" :formatter="formatTd" min-width="12%"> <template slot-scope="scope"> <el-link type="primary" v-if="scope.row.xxxx" @click="xxxx(scope.row)" >{{scope.row.xxxx}}</el-link> <span v-else>--</span> </template> </el-table-column> <el-table-column prop="xxxx" label="xxxx" align="center" :formatter="formatTd" min-width="12%"></el-table-column> <el-table-column prop="xxxx" label="xxxx" align="center" :formatter="formatTd" min-width="12%"></el-table-column> <!-- 表格數據為空 --> <div slot="empty" v-show="isShow"> <emptyTable emptyText="暫無相關數據"></emptyTable> </div> </el-table>