element table 表头怎样进行合并

Question

让 入住日期与离开日期两列的数据处理后合并成一列

Answer 1

使用vue的插槽，代码如下

<el-table-column prop="date" label="预定日期">
    <template slot-scope="scope">
        <span>{{scope.row.checkInDate}} ~ {{scope.row.checkOutDate}}</span>
    </template>
</el-table-column>

如果日期格式希望自定义，可以加上vue过滤器来格式化日期。示例代码：

    {{scope.row.checkInDate | formatDate}}

Answer 2

根据alsowen回答，贴一下我的代码

<el-table-column 
      label="预订日期"
       width="120"
       align='center'>
    <template slot-scope="scope">
      <span>{{scope.row.checkin_date | joinDate}} ~ {{scope.row.checkout_date | joinDate}}</span>
    </template>
</el-table-column>