vue 過濾器基本用法以及封裝過濾器

2021-09-10 21:54:42 字數 777 閱讀 6068

理解:不改變data的資料格式,在介面顯示處理後的資料格式

比如:對陣列中的日期進行擷取

整體**:

封裝過濾器filter如下:

在vue-cli腳手架裡面的src檔案下面的components中建立乙個filter.js檔案:

然後在filter裡面寫入過濾器方法:

//過濾器

function formatstata(status) ;

return statusmap[status]

}function statuscolor(status);

return 'background: '+statusmap[status]

}function statuscolors(status);

return 'background: '+statusmaps[status]

}export ;

在main.js檔案中:

// 全域性註冊過濾器

import * as filters from './components/filter.js';

// console.log(filters[key]);

object.keys(filters).foreach((key) => );

然後就可以在全域性使用過濾器了:

}

vue 字典過濾器封裝

一 建立檔案 utils資料夾下建立乙個datadictionary.js檔案二 需要過濾的資料如下進行設定 const datajson export default datajson三 引入註冊 main.js引入全域性註冊使用 import datadic from utils datadic...

Vue 過濾器案例(全域性過濾器和區域性過濾器)

doctype html en utf 8 viewport content width device width,initial scale 1.0 js vue 2.4.0 js script 過濾器 title head 兩個過濾器的名稱都為msgformat,但是控制不同作用,乙個是全域性的...

filters過濾器封裝

filters.js import vue from vue 秒轉時分 vue.filter timestamp function second time return time 時間戳轉日期 1569736900 2019 09 29 vue.filter timefilter function ...