过滤器

 

1.过滤器仅在2.0上适用,常用于插值表达式和v-bind属性绑定。

2.要定义到filter节点下,本质是一个函数。

3.在过滤器的形参中,就可以获取到“管道符”前面是待处理的那个值。

4.在过滤器中一定要有return值。

5.如果全局过滤器和私有过滤器名字一致,此时按照就近原则,最先调用的是私有过滤器。

 

<body>
  <div id="app">
      <p>message的值{{message|capi}}</p>
  </div>
  <div id="app2">
      <p>message的值{{message|capi}}</p>
  </div>
  <script src="./vue-2.6.12.js"></script>
  <script>

      // 全局过滤器
      Vue.filter('capi',function(str){
          const first = str.charAt(0).toUpperCase();
          const all = str.slice(1);
          return first +all;
      })
      const app = new Vue({
          el:"#app",
          data:{
              message:'hello Vue.js'
          },
          filters:{
              capi(val){
                  const first = val.charAt(0).toUpperCase();
                  const all = val.slice(1);
                  return first+all;
              }
          }
      })
      const app2 = new Vue({
          el:'#app2',
          data:{
              message:'hello Java'
          }
      })
  </script>
</body>

38.侦听器

posted @ 2021-08-27 10:26  ajaXJson  阅读(23)  评论(0编辑  收藏  举报