element-ui 表格数据时间格式化的方法(无插件)

使用场景:

当el-table 的列表 中包含时间格式的数据,对其进行格式化操作;

效果:

格式化为 'yyyy-MM-dd' 形式;

操作步骤:

在列中绑定formatter 该属性

其中dateFormat是格式化操作的逻辑;过滤出需要格式化的列的prop即可


    /**
     * @description: 格式化日期
     * @param {*} row
     * @param {*} column
     * @return {*}
     * @author: greatwang
     */
    dateFormat(row, column) {
      if (column.property === 'releaseTime' || column.property === 'trainingStarttime' || column.property === 'trainingEndtime') {
//       返回格式化的列
        return row[column.property].substring(0,10)
      }else{
//       返回不需要惊醒格式化列源
        return row[column.property]
      }
    },

另一种场景:

如果在表格中使用了插槽,那么上述的formatter方法会不起作用;

解决方法:使用filter 过滤器进行格式化

代码片:

  filters: {
    /**
     * @description: 格式化日期
     * @param {*} val
     * @return {*}
     * @author: greatwang
     */
    dateFormat(val) {
      //       返回不需要惊醒格式化列源
      return val.substring(0,10)
    }
  },

 

 

 

 

 

  • 3
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值