美文网首页
vue、ts全局filters的用法(多个过滤)

vue、ts全局filters的用法(多个过滤)

作者: jane819 | 来源:发表于2019-03-14 15:07 被阅读0次
  • filters文件夹新建需要过滤文件夹(列:worksheetStatus.ts)
    /**
  • 质检状态
    */
    function worksheetStatus(status) {
    switch (status) {
    case 2:
    return '质检不合格'
    case 3:
    return '质检合格'
    case 4:
    return '用户已确认'
    case 5:
    return '全部'
    default:
    return '未质检'
    }
    }
    export default worksheetStatus
* 再建一个index.ts(引入多个需要过滤的ts)

import _Vue from 'vue'

import dateFormat from './dateFormat'
// 严重程度
import severity from './severity'
// 未质检
import worksheetStatus from './worksheetStatus'
// 订单状态
import BusinessStatus from './BusinessStatus'

const injectFilters = (Vue:typeof _Vue) => {
Vue.filter('dateFormat', dateFormat)
Vue.filter('severity', severity)
Vue.filter('worksheetStatus', worksheetStatus)
Vue.filter('BusinessStatus', BusinessStatus)
}

export default injectFilters

* 在main.ts 里引入

import injectFilters from '@/filters'

/**

  • 注入全局的filter
    */
    injectFilters(Vue)
  • 在组件里使用
 {{ scope.row.worksheet_status | worksheetStatus }} // 1.你需要过滤的数据,2.过滤器

相关文章

网友评论

      本文标题:vue、ts全局filters的用法(多个过滤)

      本文链接:https://www.haomeiwen.com/subject/fsaqmqtx.html