相关疑难解决方法(0)

如何在Vuejs组件中应用过滤器?

如果我有一个简单的过滤器,请说:

Vue.filter('foo', function (value) {
    return value.replace(/foo/g, 'bar');
});
Run Code Online (Sandbox Code Playgroud)

还有一个简单的组件:

Vue.component('example', {
    props: {
        msg: String,
    },
});
Run Code Online (Sandbox Code Playgroud)

在标记内:

<example inline-template :msg="My foo is full of foo drinks!">
    {{ msg }}
</example>
Run Code Online (Sandbox Code Playgroud)

我可以简单地应用过滤器:

<example inline-template :msg="My foo is full of foo drinks!">
    {{ msg | foo }}
</example>
Run Code Online (Sandbox Code Playgroud)

我可以在模板中轻松应用过滤器,但是我想将该逻辑移回组件中.

不需要是过滤器,但基本上是为数据字段创建getter和setter的方法.

就像是:

Vue.component('example', {
    props: {
        msg: {
            type: String,
            getValue: function(value) {
                return value.replace(/foo/g, 'bar');
            },
        }
    },
});
Run Code Online (Sandbox Code Playgroud)

javascript vue.js

9
推荐指数
2
解决办法
1万
查看次数

标签 统计

javascript ×1

vue.js ×1