Vue CLI 3中如何实现并使用全局过滤器实例代码详细解析？

本文共计785个文字，预计阅读时间需要4分钟。

在Vue 1.x版本中，自带了一些基础的过滤器（可能不太常用）。到了Vue 2.x版本后，这些内置过滤器被移除了。如果需要使用过滤器，开发者需要自行定义。可以将过滤器定义为自定义过滤器。

在vue1.x版本里是自带里几个基础的过滤器的（虽然不怎么用到）。

到了vue2.x版本之后，内置到几个过滤器就被删掉了，如果需要用到过滤器，就要开发者自己去定义。

可以把过滤器定义在某个组件内部，但这样就成了局部过滤器，在别的组件里是无法使用的。所以通常不会这么做。

也可以把过滤器写在main.js里。但如果项目中存在多个过滤器，这会使main.js文件看上去很庞大，不便于后期维护。

所以通常会新建一个js文件，专门用来存放所有过滤器。最后再引到main.js中供全局使用。

1、创建 filters.js

首先新建一个filters.js文件。把这个文件放在 src/assets 里。

因为这里是用来存放静态资源的。这个文件夹可以用来存放图片、css和部分自定义的功能的js资源。如果需要更好的分类，可以在 assets 文件夹里再创建 js 、 css 、 img 等文件夹。