antd table 表格上下错位

Question

如图，表格上下错位，调出控制台上下拉一下又好了，请问这个如何处理

Answer 1

你这个问题解决了吗？如果fixed取消掉的话，那就达不到固定的效果了，只有加了fixed才会出现这个问题。

Answer 2

.ant-table-tbody > tr > td {

word-wrap: break-word;
word-break: break-all;

}

Answer 3

  .ant-table-fixed-header .ant-table-body-inner {
    overflow: hidden; // 很重要
  }

3版本的antd应该这么设置就好了

Answer 4

这表格不是用table写的吧

Answer 5

.ant-table-fixed {
    tr {
        height: auto !important;
    }
}

Answer 6

数据渲染完调用一下这个方法同步高度就可以了。
注意 this.$el，是当前表格的父容器，如果页面存在多个表格，需要替换为指定表格的父容器

methods: {
    // 同步行高
    syncRowHeights() {
      this.$nextTick(() => {
        const fixedRows = this.$el.querySelectorAll('.ant-table-fixed-left .ant-table-tbody > tr')
        const scrollRows = this.$el.querySelectorAll('.ant-table-scroll .ant-table-tbody > tr')
        fixedRows.forEach((fixedRow, index) => {
          const scrollRow = scrollRows[index]
          const maxHeight = Math.max(fixedRow.offsetHeight, scrollRow.offsetHeight)
          fixedRow.style.height = `${maxHeight}px`
          scrollRow.style.height = `${maxHeight}px`
        })
      })
    },
}