Vue — filter 过滤器

最后更新于:2022-04-02 08:06:34

[TOC] >[success] # filter -- 过滤器 ~~~ 1.Vue.js 允许你自定义过滤器,可被用作一些常见的文本格式化。过滤器可以用在 两个地方:大胡子语法插值和 v-bind 表达式。 ~~~ >[danger] ##### 定义全局过滤器 -- Vue.filter ~~~ 1.使用 Vue.filter 创建全局过滤器 2.Vue.filter('过滤器名称', function (被过滤值做参数,过滤器函数的第一个参数) {}),要对这里做个说明, 首先过滤器的参数可以是任意个数,具体的可以参考下面的案例 3.过滤器可以叠加使用 ~~~ ~~~ Title

{{ msg| msgFormat|msgFormat2('参数1', '参数2') }}

~~~ >[danger] ##### 私有过滤器 ~~~ 1.私有过滤器仅局限于当前vue 对象 2.全局过滤器是对所有创建的vue对象都好用 3.私有有s,全局没有 4. 过滤器调用的时候,采用的是就近原则,如果私有过滤器和全局过滤器名称一 致了,这时候 优先调用私有过滤器 ~~~ ~~~ Title

{{ msg|msgFormat2('参数1', '参数2') }}

~~~ >[info] ## 过滤器是必须的么? ~~~ 1.在工作中经常会遇到一些值需要被进行对应匹配,是否都是需要使用过滤器呢? 这里给的答案肯定是不必要,下面给出一个常用的案例场景来实现类似过滤器的效果 ~~~ >[danger] ##### 案例 ~~~ 1.下面只是对一个思路,至于实际工作取决于个人使用 ~~~ ~~~

第一个下拉选中的值{{selected|privateMsgFormat}}

第二个下拉选中的值{{mapOp[selected1]}}

~~~
';