elementUI中Vue 2方式<el-table>表格中列表列头内容过长，不换行处理

使用render-header属性
<el-table-column
 ...
 :render-header="headerRender"
></el-table-column>

methods: {
  headerRenderer(h, { column }) {
    // 使用h函数创建VNode，防止表头内容换行
    return h(
      'div',
      {
        style: {
          whiteSpace: 'nowrap', // 防止文本换行
          overflow: 'hidden', // 隐藏超出部分
          textOverflow: 'ellipsis', // 超出部分显示省略号
        },
      },
      column.label
    );
  },
},

这段代码中，我们使用Vue的渲染函数h来创建表头单元格的内容，直接在其中设置了whiteSpace: 'nowrap'来避免文本换行，并通过overflow和textOverflow来处理可能的溢出情况，显示省略号。

这样，即便CSS样式因某种原因未生效，也能确保表头文字不换行并优雅地处理过长文本。