antd vue 中表格得customRender渲染中使用过滤器filters

antd vue 中表格得customRender渲染中使用过滤器filters

问题描述

在业务开发中，有时候对于时间处理，可能不是全部都要时分秒得显示，这里我使用vue得过滤器，然后就出现一个毛病，我是在表头定义得时候，直接使用得customRender渲染得，普通得过滤器是通过 | 来实现，那么这里怎么处理呢

问题解决

使用-> this.$options.filters.过滤器名字(参数)

代码

• 全局定义过滤器

	import Vue from 'vue'
	import moment from 'moment'
	// 定义一个全局过滤器
	Vue.filter('minFormat', function (dataStr, pattern = 'YYYY-MM-DD HH:mm') {
	  return moment(dataStr).format(pattern)
	})

• 使用

// 这里是表头定义
tableColumns: [
     {
       title: '更新时间',
       dataIndex: 'updatedTime',
       customRender: (text) => {
         return (
           <div>
             { this.$options.filters.minFormat(text) } // 在这里直接如此调用即可，有点像调用方法得样子
           </div>
         )
       }
     }
   ]

效果