Vue/cli3中filter簡單使用

在scr目錄下建立 filter 文件夾，在文件價中新建文件 filter.js 

我們可以將過濾器寫在該文件夾下

export function firstFilter(value,dict){
     return dict[value] ? dict[value]:value
}

接着我們在main.js中注冊全局過濾器，加入如下代碼

import * as filters from './filter/filter'

Object.keys(filters).forEach(key => {
 Vue.filter(key, filters[key])
})

這樣我們就注冊完了我可以在任意組件中直接使用這個過濾器

在test.vue中

<template>
  <div>
    <el-input v-model="testVal"/><br/>
    {{testVal|firstFilter(dic)}}//testVal會作為第一個參數直接傳入
  </div>
</template>

<script>
export default {
data(){
  return{
    testVal: ' ',
    dic:{//一般是傳入
    1:'first',
    2:'secound'
　　}
　}
 }
}
</script>

<style>

</style>

輸入1 輸出 first