vue.js过滤器会执行嵌套方法无法执行的任何操作吗?

时间:2018-08-03 04:25:04

标签: vue.js

我想知道vue.js过滤器是否实现了嵌套方法无法实现的目标。作为vue.js新手,似乎没有实际用途的额外语法。例如,使用在过滤器中定义的“大写”功能代替此代码:

{{键|大写}}

我只需编写一下,然后将“ capitalize”功能移至“ methods”部分,而不是“ filters”:

{{capitalize(key)}}

是否存在用例中嵌套方法不足或过滤器只是语法糖的情况? (如果是后者,它们不足以满足我的口味,但是我希望这个问题可以帮助开发我的调色板。)

此代码来自此处https://vuejs.org/v2/examples/grid-component.html的vue.js参考

1 个答案:

答案 0 :(得分:2)

过滤器只不过是您提到的javascript函数。

因此,通常可以像在methods中的函数那样定义它们。

我建议使用filters,因为这样可以很好地将不同的逻辑划分为单独的部分并利用框架的完整功能。

一个用例是,当您需要使用多个过滤器/操作时,由于过滤器在内部为chained,因此它们很方便。

filters: {
 removespace: function(value) {
   return value.replace(/\s/g, '')
 },
 lowercase: function(value) {
   return value.toUpperCase()
 },
}

<p>{{ message | lowercase | removespace }}</p>

built in过滤器(事件)

<input v-on="keyup:myFunction | key enter">

<!--myFunction will be called only when the enter key is pressed.-->