首页 > 其他 > 详细

table表头换行

时间:2020-09-17 14:39:50      阅读:163      评论:0      收藏:0      [点我收藏+]

技术分享图片

 

 

 方法一:

<el-table
      height="570" size="mini"
      :data="projectData"
      style="width: 100%"
    >
      <el-table-column
        show-overflow-tooltip
        prop="project_dept_user_name"
        label="项目负责人"
        min-width="120"
      ></el-table-column>
      <el-table-column
        show-overflow-tooltip
        prop="status_name"
        label="项目状态"
        min-width="120"
      ></el-table-column>
      <el-table-column show-overflow-tooltip label="图纸文件是否|全部交付" :render-header="renderheader" min-width="100">
        <template slot-scope="scope" v-if=" scope.row.all_deliver==0"></template>
        <template slot-scope="scope" v-else></template>
      </el-table-column>
      <el-table-column
        show-overflow-tooltip :render-header="renderheader"
        label="单位工时产值|(元/小时)"
        min-width="120"
      >
        <template slot-scope="scope">{{scope.row.hours_amount/100}}</template>
      </el-table-column>
    </el-table>
 // 表头换行
      renderheader(h, {column, $index}) {
        return h(‘span‘, {}, [
          h(‘span‘, {}, column.label.split(‘|‘)[0]),
          h(‘br‘),
          h(‘span‘, {}, column.label.split(‘|‘)[1])
        ])
      },

  方法二

<el-table height="580px" :data="tableData" size="mini" style="width: 100%">
        <el-table-column prop="project_num" label="角色" min-width="60"></el-table-column>
        <el-table-column prop="project_num" :label="‘合同额 \n (元)‘" min-width="60"></el-table-column>
        <el-table-column prop="project_num" :label="‘回款额 \n (元)‘" min-width="60"></el-table-column>
        <el-table-column prop="project_num" label="回款比例" min-width="60"></el-table-column>
        <el-table-column prop="project_num" :label="‘计业绩金额 \n (元)‘" min-width="60"></el-table-column>
        <el-table-column prop="project_num" :label="‘个人业绩 \n (元)‘" min-width="60"></el-table-column>
      </el-table>

 

table表头换行

原文:https://www.cnblogs.com/jxfd/p/13684975.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!