在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  阅读(564)  评论(0编辑  收藏  举报