zoukankan html css js c++ java

Vue过滤器 filters

局部过滤器：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
        <title>filters</title>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
        <div id="app">
            <input type="text" v-model="test" placeholder="请输入"/>
            <div>{{test|filter1|filter2}}</div>
        </div>
    </body>
</html>
<script type="text/javascript" charset="utf-8">
    var app = new Vue({
        el: "#app",
        data: {
            test: ''
        },
        filters: {
            filter1: function(val) {
                return val.toUpperCase();
            },
            filter2: function(val) {
                var reg = /d/g;
                return val.replace(reg, '*');
            }
        }
    });
</script>

全局过滤器：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
        <title>filters</title>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
        <div id="app">
            <input type="text" v-model="test" placeholder="请输入" />
            <div>{{test|filter1|filter2}}</div>
        </div>
    </body>
</html>
<script type="text/javascript" charset="utf-8">
    Vue.filter('filter1', function(val) {
        return val.toUpperCase();
    });
    
    Vue.filter('filter2', function(val) {
        var reg = /d/g;
        return val.replace(reg, '*');
    });
    
    var app = new Vue({
        el: "#app",
        data: {
            test: ''
        },
    });
</script>

一辈子很短，努力的做好两件事就好；第一件事是热爱生活，好好的去爱身边的人；第二件事是努力学习，在工作中取得不一样的成绩，实现自己的价值，而不是仅仅为了赚钱。

查看全文

相关阅读:
mysql查询重复
 JS全局屏蔽回车事件
 java判断某个字符串包含某个字符串的个数
 给Eclipse提速的7个技巧(转)
Mysql中将查询出来的多列的值用逗号拼接
 模仿淘宝手机号码输入框
 浏览器的默认样式
 GUBE---一丝
 学习CSS布局
 CSS 居中大全

原文地址：https://www.cnblogs.com/antao/p/12985464.html