解决element-ui表格表头内容太长时的换行问题

用 render-header（列标题 Label 区域渲染使用的 Function，即渲染这一列的列标题区域所用的函数）

HTML:

<el-table border :data="tableData" v-loading="loading" @row-dblclick="handleSelect"
      :row-class-name="tableRowClassName">
      <el-table-column v-for="(item,index) in tableColumn" :label="item.name"
                :prop="item.prop" v-if="item.show" :key="index" align="center" :render-header="labelHead"></el-table-column></el-table>

VUE：

methods:{
          labelHead(h,{column,index}){
                    let l = column.label.length
                    let f = 16 //每个字大小，其实是每个字的比例值，大概会比字体大小差不多大一点，
                   column.minWidth = f*l //字大小乘个数即长度 ,注意不要加px像素，这里minWidth只是一个比例值，不是真正的长度　　　　　　　　　　　　//然后将列标题放在一个div块中，注意块的宽度一定要100%，否则表格显示不完全
                  return h('div',{class:'table-head',style:{width:'100%'}},[column.label])
     
       },
    //.......
}

css:

 .table-head{
    font-size:14px!important;//设置固定的字体大小
  }