更新（2019/11/20）：据网友（nchencc）提供的方法，只需要在App.vue的style里添加以下样式即可！

.el-table--border th.gutter:last-of-type {
    display: block!important;
    width: 17px!important;
}

如以上解决不了的再往下看↓

一、出现问题：

  1. 在vue项目中引入elementUI的table组件，当将表格的头部和列固定后就会出现表头与内容错位的问题。如下图：

elementUI的table表格表头错位

二、解决方法：

  1. 在遇到该问题时，我百度了解决方法，差不多都是添加css样式覆盖，但用在我的项目中是没能解决的。后来秉着解决问题和优化用户体验的耐心，逐步去排查。后来排查找到当拖动浏览器页面后发现表头就不再错位。所以按我所知，这很有可能是渲染前后的问题，在我能力不足去修改elementUI组件的同时，我用了个土方法解决该问题，虽然很蹩脚，但也算是解决方法的一种。
  2. 在el-table组件挂载一个ref="configurationTable"，然后在每次请求数据成功后动一动表格的默认宽度
    1. this.$refs.configurationTable.$el.style.width = '99.99%' （如果99.99%不行，可以将值设置小一点试试）

三、建议意见：

  1. 该解决方法很蹩脚，如果大家以后有更好的解决方法，还望告知。非常感谢~
Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...

avatar Vue