zoukankan      html  css  js  c++  java
  • Vue -过滤器

    Vue允许自定义过滤器,用作一些常见的文本格式化过滤器只用在两个地方:mustache插值v-bind表达式

    全局过滤器

    Vue.filter ( ' 过滤器名字 ' ,回调函数 )

    <body>
    <div id="app">
       原msg字符串:{{ msg }} <br>
       过滤后的msg:{{ msg | msgFormat }} <!--通过管道符 | 来使用过滤器,若要传参,msgFormat(arg),参数可传多个-->
    </div>
    <script>
         //定义一个Vue的全局过滤器,名字叫做msgFormat
         //回调函数的第一个参数是管道符前面传递的数据,若上面有参数传来,接收即可,function(data,arg)
         Vue.filter('msgFormat',function (data) {
             return data.replace(/*/g,'')
         })
    
        var vm = new Vue({
            el: '#app',
            data: {
                msg:'*H*e*l*l*o*'
            }
        })
    </script>
    </body>

     

    全局过滤器可被所有的vm实例使用

    可对同一数据同时使用多个过滤器,依样画葫芦

     

    私有过滤器

    在创建vm对象时使用filters属性可为这个实例对象建立私有过滤器

    <body>
    <div id="app">
       {{ msg | msgFormat }} 
    </div>
    <script>
        var vm = new Vue({
            el: '#app',
            data: {
                msg:'*H*e*l*l*o*'
            },
            filters:{
                //定义私有过滤器,过滤器名称:处理函数
                msgFormat:function (data) {
                    return data.replace(/*/g,'') 
                }
            }
        })
    </script>
    </body>

    过滤器采用就近原则,如果私有过滤器和全局过滤器重名则优先使用自身的私有过滤器

  • 相关阅读:
    Python用户交互
    Python中的变量和常量
    Python的第一个程序:‘Hello World!’
    idea和pycharm激活方法
    Python环境准备(安装python解释器)
    Python简介
    编程与编程语言
    Linux下升级安装Python-3.6.2版本
    yum安装php5.5,php5.6和php7.0
    Postfix邮件黑名单和白名单
  • 原文地址:https://www.cnblogs.com/Grani/p/9626453.html
Copyright © 2011-2022 走看看