本文共 804 字，大约阅读时间需要 2 分钟。

需求1：在双大括号中处理时间格式

使用前：

   
        日期：
    
     {
  {item.orderTime}}
    
    状态：
    
     {
  {item.status}}
    
    
    
   

使用前页面效果：

使用后代码：

   
        日期：
    
     {
  {item.orderTime | dateFormat}}
    
    状态：
    
     {
  {item.status}}
    
    
    
   

全局注册过滤器

Vue.filter('dateFormat',function(dateStr){    return moment(dateStr).format('YYYY-MM-DD');})

使用后页面效果：

需求2：在element-ui的table组件中处理时间格式

使用前代码：

使用前页面效果：

使用后代码：

当前组件的methods中

methods:{    dateFormat(row,colnum){        // colnum为使用了formatter的列        // clonum.property为当前列的prop值        // row为当前行，是一个类数组对象，可通过[]拿值        return moment(row[colnum.property]).format('YYYY-MM-DD')    },}

使用后页面效果：

说明：在element-ui的table组件中，自带属性formatter，用来格式化内容

转载地址：http://prtgn.baihongyu.com/