【vue】过滤器的使用

一、在methods中使用过滤器------全局定义的过滤器

  

复制代码
//main.js中

import Vue from 'vue'
Vue.filter('testFilter1',function(val){
          console.log("全局过滤器",val);
 })


//demo.js
methods:{
    getGlobal(){
         //使用Vue.Filter()方式获取全局过滤器
        var te = Vue.filter('testFilter1');
        //调用全局过滤器
        te('需要过滤的东东');
    }
}
复制代码

 

二、在methods中使用过滤器------在组件中定义的过滤器 

复制代码
filters:{
    testFilter2(val){
        console.log('本地过滤器',val);
     }
},
methods:{
    getLocal(){
        //使用this.$options.filters[]方式获取本地过滤器
        var te = this.$options.filters['testFilter2'];
         //调用本地过滤器
         te('需要过滤的东东');
    }
}    
复制代码

三、在页面中使用过滤器

{{ ‘需要过滤的东东’ | testFilter2()}}

如果需要参数

{{ ‘需要过滤的东东’ | testFilter2(参数1,参数2)}}

 

posted on   smile轉角  阅读(173)  评论(0编辑  收藏  举报

编辑推荐:
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
阅读排行:
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通

导航

统计

点击右上角即可分享
微信分享提示