table表頭換行

 

 

 方法一：

<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>