vue中filters选项的用法

骑猪看日落 2022-05-25 02:41 146阅读 0赞

vue中filters选项的用法

filters是.vue文件中export对象中的一个选项，其类型是Object，即包含Vue实例可用过滤器的哈希表。

下面讲讲filters选项的用法

1、html如下

<div id="app">
      {
       {message | filters2| filters3(true,priceCount)}}
    </div>

2、js如下

3、控制台的输出

helloVue.js:17 arg:199
    helloVue.js:26 arg_1:191
    helloVue.js:27 arg_2:true
    helloVue.js:28 arg_3:0.8
    helloVue.js:35 result152.8

4、分析

首先，在data里面定义两个变量message:199，priceCount:0.8,

然后，在.vue文件中的<script>里面的filters选项里面定义两个函数filters2(arg)和filters3(arg\_1,arg\_2,arg\_3)

最后，在.vue文件里面的<template>中调用filters中定义的函数，如下所示：

<div id="app">
      {
       {message | filters2| filters3(true,priceCount)}}
    </div>

\{ \{\}\}里面第一个变量message是在data里面定义的变量，message作为filters2函数的参数，然后filters2函数的返回值result作为filter3函数的第一个参数，即filters3(result,true,priceCount)，所以得到上述控制台的输出

转载地址：[点击打开链接][Link 1]

[Link 1]: http://www.jb51.net/article/118695.htm

还没有评论，来说两句吧...