vue、ts全局filters的用法(多個過濾)

  • filters文件夾新建需要過濾文件夾(列:worksheetStatus.ts)
    /**
  • 質(zhì)檢狀態(tài)
    */
    function worksheetStatus(status) {
    switch (status) {
    case 2:
    return '質(zhì)檢不合格'
    case 3:
    return '質(zhì)檢合格'
    case 4:
    return '用戶已確認'
    case 5:
    return '全部'
    default:
    return '未質(zhì)檢'
    }
    }
    export default worksheetStatus
* 再建一個index.ts(引入多個需要過濾的ts)

import _Vue from 'vue'

import dateFormat from './dateFormat'
// 嚴重程度
import severity from './severity'
// 未質(zhì)檢
import worksheetStatus from './worksheetStatus'
// 訂單狀態(tài)
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.你需要過濾的數(shù)據(jù),2.過濾器
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容