在vue-cli项目中定义全局 filter、method 方法

1、创建 filters.js（methods.js） 文件：

2、filters.js（methos.js） 中定义全局过滤方法：

 

 1 export default {
 2 　　/** 时间戳转换 */
 3 　　showTime (time) {
 4 　　　　let date = null
 5 　　　　if ((time + '').length === 10) {
 6 　　　　　　date = new Date(time * 1000)
 7 　　　　} else {
 8 　　　　　　date = new Date(time)
 9 　　　　}
10 　　　　const Y = date.getFullYear()
11 　　　　const M = date.getMonth() + 1
12 　　　　const D = date.getDate()
13 　　　　const H = date.getHours()
14 　　　　const MM = date.getMinutes()
15 　　　　const S = date.getSeconds()
16 　　　　return `${Y}-${(M > 9 ? M : ('0' + M))}-${(D > 9 ? D : ('0' + D))} ${(H > 9 ? H : ('0' + H))}:${(MM > 9 ? MM : ('0' + MM))}:${(S > 9 ? S : ('0' + S))}`
17 },
18 　　/** 根据身份证号获取出生日期 */
19 　　getBirthday (idCard) {
20 　　　　let birthday = ''
21 　　　　if (idCard) {
22 　　　　　　if (idCard.length === 15) {
23 　　　　　　　　birthday = `19${idCard.substr(6, 6)}`
24 　　　　} else if (idCard.length === 18) {
25 　　　　　　birthday = idCard.substr(6, 8)
26 　　　　}
27 
28 　　　　birthday = birthday.replace(/(.{4})(.{2})/, '$1-$2-')
29 　　　　}
30 　　　　return birthday
31 　　}
32 }

 

3、main.js入口文件引用

1 import filters from './filters'
2 import filters from './methods'
3  Object.keys(filters).forEach(k => {
4 　　Vue.filter(k, filters[k])
5 })
6 　 Object.keys(methods).forEach(k => {
7 　　 Vue.prototype[k] = methods[k]
8   })

 

4、组建中使用

1 <template>
2 　　// 过滤
3     <div>{{ 1454664434 | showTime }}</div>
4 </template>

 

5、显示

 

posted @ 2019-04-17 13:54  YINGYAN  阅读(572)  评论(0)  编辑  收藏  举报