在实际项目开发中, 在某一组件中声明的全局过滤器 vue.filter 并不能在其他组件中使用, 所以, 我认为只要调用两次以上或者可能会被调用两次以上的过滤器, 就应该写入统一个过滤器文件中, 方便统一调用. 下面是如果创建并调用统一的过滤器的方法:
1. 在公用 js 文件夹中新建文件 filters.js
2. 在 filters.js 中使用 es6 写法写入 (因为我用的是 vue-cli, 自带 babel 组件一套, 可以自动转换 es6 写法到 es5, 所以不用考虑兼容性)
- let formatDate = time => {
- if(time){
- return time.slice(5,16)
- }
- }
- export { formatDate }
3. 找到 main.js 引入
- import * as filters from './assets/js/filters.js'
- Object.keys(filters).forEach(key => {
- Vue.filter(key, filters[key])
- })
4. 在组件中使用
<h2 > 时间:<span>{{createTime | formatDate(createTime)}}</span></h2>
来源: http://www.qdfuns.com/article/13237/ac74e3bb40ece6d96afc862259ee26df.html