Why can't use v-text="doSomething() | filter('args')" ?
Maybe the pipeline operator "|" ?
v-text="doSomething() | filter('args')"
Why not use getters
when you can or just inline plain javascript otherwise? v-text="filter(doSomething(), 'args')"
?
with:
export default {
methods: {
doSomething () {...},
filter () {...}
}
}
@nickmessing I have registered filter in Vue.filter and don't want to repeat in a new Vue()
According to docs
Vue 2.x filters can only be used inside mustache interpolations and v-bind expressions (the latter supported since 2.1.0), because filters are primarily designed for text transformation purposes. For more complex data transforms in other directives, you should use Computed properties instead
Considering that you want to pass some aditional arguments I think filters is not a good way to go.
I'd prefer:
// filters.js
export myCoolFilter (text, arg1, arg2) => `${text} ${arg1} ${arg2}`
<!-- Component.vue -->
<template>
<div v-text="myComputed" />
</template>
md5-55ded034452e70f73df05be097dea4eb
Filters are a pretty bad design decision IMO anywhere other than simple text processing like uppercase
You can access your filters in your component like that: this.$options.filters.myCoolFilter
. So in v-text
you could write: <div v-text="$options.filters.myCoolFilter(myData)"
@Nirazul Thanks ^_^
@Nirazul
Filters in directives were intentionally removed in Vue 2.0 after intense discussions, and sorry to say that we won't bring them back now, because the situation hasn't changed.
@LinusBorg
I'm ok with this, I think you meant @leupom ;D
Oh, right. Thanks!
Just an example using v-bind
:text-content.prop="text | filter"
Most helpful comment
You can access your filters in your component like that:
this.$options.filters.myCoolFilter
. So inv-text
you could write:<div v-text="$options.filters.myCoolFilter(myData)"