美文网首页
解决Element UI 表格使用 'fixed' 属性时错位问

解决Element UI 表格使用 'fixed' 属性时错位问

作者: WebDog369 | 来源:发表于2021-12-21 17:02 被阅读0次

使用了fixed后表格悬浮部分错位的问题让人头疼,这里给大家提供一个解决方法,亲测有效。
这个解决办法有一个前提条件: 你的表格里使用了 “show-overflow-tooltip” 属性,导致未浮动的表格正常显示,浮动的表格变宽错位。

<el-table-column prop="name" label="姓名" min-width="100" show-overflow-tooltip></el-table-column>
<el-table-column prop="sex" label="性别" min-width="100" show-overflow-tooltip></el-table-column>
<el-table-column prop="age" label="年龄" min-width="100" show-overflow-tooltip></el-table-column>
 <el-table-column label="操作"  width="151"  fixed="right">
      <template slot-scope="scope">
          <el-button type="primary" size="mini" @click="handleClick(scope.row)">操作按钮</el-button>
     </template>
</el-table-column>

解决办法:把所有el-table-column标签都加上“ show-overflow-tooltip”属性即可解决错位问题,至于原理,我猜是element官方的一个bug,fixed表格并未完全继承原表格的“ show-overflow-tooltip”属性所导致的。

相关文章

网友评论

      本文标题:解决Element UI 表格使用 'fixed' 属性时错位问

      本文链接:https://www.haomeiwen.com/subject/wamxqrtx.html