el-table 列偏移,el-table表格不齐,el-table表格对不齐
前端vue开发后台项目经常会使用element-ui组件,估计el-table组件算是其中使用率相当高的了,在这其中有时候就会出现表格列偏移的问题,尤其是列较长表格设置表头或者表尾列固定时经过测试,发现设置使用 :min-width属性可以解决这个问题但之后发现有时候使用了该属性还会出现偏移问题,又又经过测试,发现动态调节 :min-width的数值,可以解决这个问题,确实有效,但是这个数值比例没
·
前端vue开发后台项目经常会使用element-ui组件,估计el-table组件算是其中使用率相当高的了,在这其中有时候就会出现表格列偏移的问题,尤其是列较长表格设置表头或者表尾列固定时
经过测试,发现设置使用 :min-width 属性可以解决这个问题

但之后发现有时候使用了该属性还会出现偏移问题,又又 经过测试,发现动态调节 :min-width 的数值,可以解决这个问题,确实有效,但是这个数值比例没研究出来,只能是所有列动态增减玄学调整,根据偏移的尺度来找感觉.....
举个我调节好的橡木栗子吧:
<el-table :data="dataForm.storageDataList"
border
v-loading="storageListLoading"
style="top:10px;">
<el-table-column prop="locationName"
label="位置名称"
header-align="center"
min-width="180px"
align="center">
<template slot-scope="scope">{{
scope.row.locationName
| replaceLocationFilter(scope.row, roadList)
}}</template>
</el-table-column>
<el-table-column prop="storageArea"
header-align="center"
align="center"
min-width="120px"
label="面积(㎡)">
</el-table-column>
<el-table-column header-align="center"
align="center"
min-width="40px"
label="操作">
<template slot-scope="scope">
<el-button @click="storageIndoDiv(scope.row.id)"
size="small"
type="text">详情</el-button>
</template>
</el-table-column>
</el-table>
更多推荐



所有评论(0)