1.兼容谷歌浏览器以及火狐浏览器
element表格中有一个doLayout方法,使用改方法时对 Table 进行重新布局。
mounted(){
setTimeout(()=> {
this.$refs.table.doLayout()
},1200)
}
其中的this.$refs.table是在<el-table>中使用了 ref="table
<template>
<el-table
:data="tableData"
ref="table
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>
2.在谷歌浏览器中有效(APP.vue中写入下面css或者设置全局样式)
body .el-table--scrollable-y {
.el-table__body-wrapper::-webkit-scrollbar {
width: 9px;
height:9px;
}
.gutter {
width: 10px !important;
}
3(有时候没有效果)
body .el-table th.gutter {
display: table-cell!important;
}