原 el-table格式化el-table-column内容


<el-table-column
  prop="os"
  label="平台"
  :formatter="formatterBannerOs"
  align="center">
</el-table-column>
// 格式化表格方法
      formatterBannerOs: function(row, column, cellValue) {
        if (cellValue == '00') {
          return '全平台'
        } else if (cellValue == '01') {
          return '安卓'
        } else if (cellValue == '02') {
          return ' IOS'
        } 

在element-ui  table 如何格式化呢 

1.首先

复制代码代码如下:

<el-table-column prop="AuditEndTime" label="处理时间" width="120" :formatter="dateFormat" align="center"></el-table-column>

主要是:formatter="dateFormat" 这个属性 

formatter 用来格式化内容 Function(row, column, cellValue, index)  

然后在   methods 方法对象里  添加 如下方法

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

//时间格式化

      dateFormat(row, column, cellValue, index){

          const daterc = row[column.property]

          if(daterc!=null){

            const dateMat= new Date(parseInt(daterc.replace("/Date(", "").replace(")/", ""), 10));

           const year = dateMat.getFullYear();

          const month = dateMat.getMonth() + 1;

          const day = dateMat.getDate();

          const hh = dateMat.getHours();

          const mm = dateMat.getMinutes();

          const ss = dateMat.getSeconds();

          const timeFormat= year + "/" + month + "/" + day + " " + hh + ":" + mm + ":" + ss;

          return timeFormat;

          }

           

      }

格式化后:

2018/2/27 8:59:19

PS:Element UI的表格table列的宽度自适应设置

不要设置  width="110px"

?

1

2

3

<el-table-column prop="login_id" align="center" label="工号"> </el-table-column>

<el-table-column prop="login_id" width="110px" align="center" label="工号"> </el-t

猜你喜欢

转载自blog.csdn.net/weixin_41722928/article/details/84320978