16-基础-过滤器-传参数和串联使用

<!DOCTYPE html>
<html>

<head>
    <meta charset='UTF-8'>
    <meta name='viewport' content='width=device-width,initial-scale=1.0'>
    <meta http-equiv='X-UA-Compatible' content='ie=edge'>
    <title>Document</title>
</head>

<body>
    <div id='app'>
        <!-- 1. 过滤器可以传入自己的参数 -->
        {{count | a("元")}}
        <br> -----111---- <br>
        <!-- 2. 过滤器可以串联使用 -->
        {{count | aFilter("元") | bFilter}}
    </div>
    <script src='./vue.js'></script>
    <script>
        Vue.filter("a", function (v, yuan) {
            console.log(yuan);
            return v + yuan;
        });
        // 以下代码是为了测试过滤器的串联
        Vue.filter("aFilter", function (v, a) {
            return v + a;
        });
        Vue.filter("bFilter", function (v) {
            console.log(v);
            return v;
        });
        new Vue({
            el: '#app',
            data: { count: 100 },
            methods: {}
        });
    </script>
</body>

</html>

posted @ 2019-05-28 21:47  193557749  阅读(530)  评论(0编辑  收藏  举报