Vue.js 允许我们自定义过滤器,可被用作一些常见的文本格式化。过滤器可以用在两个地方:mustache 插值表达式、 v-bind表达式。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道”符指示。

1.  插值表达式

<p>{{msg | msgFormat}}</p>

管道符前面的msg:要过滤的内容

管道符后面的msgFormat:是过滤器通过msgFormat来过滤

2. 定义过滤器msgFormat

var vm = new Vue({
el: '#app',
data: {
msg: '我想我是是世界上最好看的'
},
methods: {},       
       filters: { msgFormat: function (myMsg) { //function 的第一个参数指的是管道符前面的 msg
        return myMsg.replace(/我/g, '你')         }
      }
});

vue中过滤器filter的更多相关文章

  1. vue 中全局filter过滤器的配置及使用

    在项目中使用到的经常用到过滤器,比如时间,数据截取等过滤器,如果在每个.vue中都可以复制同一个过滤器,这可以达到目的,但是遇到方法有bug时就需要诸葛修改进入不同的页面修改,这样既费时又费力,优先可 ...

  2. Spring中过滤器(Filter)和拦截器(Interceptor)的区别和联系

    在我们日常的开发中,我们经常会用到Filter和Interceptor.有时同一个功能.Filter可以做,Interceptor也可以做.有时就需要考虑使用哪一个比较好.这篇文章主要介绍一下,二者的 ...

  3. vue中过滤器比较两个数组取相同值

    在vue中需要比较两个数组取相同值 一个大数组一个 小数组,小数组是大数组的一部分取相同ID的不同name值 有两种写法,两个for循环和map写法 const toName = (ids, arr) ...

  4. vue的过滤器filter

    前记: 排版记录,未免太耽误时间,我就简单的来,下面是一个vue 过滤器的写法,demo 演示,限制一个字符串的长度. vue filter 的官网介绍 https://cn.vuejs.org/v2 ...

  5. vue基础----过滤器filter

    1.用的场景:一个功能在每个组件都能用,而computed虽然有缓存,但不能用在每一个组件,需要的话的每一个都需要写. 2.特点:改变数据的展示形式,不改变原有的形式  分为全局与局部的 <di ...

  6. Vue学习之--------Vue中过滤器(filters)的使用(代码实现)(2022/7/18)

    1.过滤器 1.1 概念 过滤器: 定义:对要显示的数据进行特定格式化后再显示(适用于一些简单逻辑的处理). 语法: 1.注册过滤器:Vue.filter(name,callback) 或 new V ...

  7. vue中过滤器filters的使用

    组件内写法 filters:{ filter:function(data,arg1,arg2){ return .... } } 全局写法 filters('filter',function(data ...

  8. JavaWeb中过滤器Filter的url-pattern设置

    源码 https://github.com/YouXianMing/Java-Web-Study/tree/master/Servlet-Filter-UrlPattern Filter顺序以及url ...

  9. JavaWeb中过滤器Filter的使用示例

    https://github.com/YouXianMing/Java-Web-Study/tree/master/Servlet-Filter 过滤器示例基于以下流程 测试效果如下 web.xml配 ...

随机推荐

  1. MVC三层架构在各框架中的特征

    转一篇写得很棒的文章:https://my.oschina.net/win199176/blog/208171?p=7&temp=1495894148424 1.基于web开发中最原始的jsp ...

  2. web应用中并发控制的实现,各种锁的集合

    参考:http://blog.csdn.net/xiangwanpeng/article/details/55106732 B/S构架的应用越来越普及,但由于它有别于C/S构架的特殊性,并发控制始终没 ...

  3. Swift字符串截取与Range使用

    1.String.Index String.Index表示一个位置,使用String与String.Index可以获取该位置的Character let str = "123456789&q ...

  4. bugku-Web-多次(异或注入,判断被过滤的关键字)

    进去看到url感觉是sql注入, 加上',报错但是%23不报错,加上'--+,也不报错,说明可以用--+注释 加上' or 1=1--+,报错 尝试' oorr 1=1--+,正常 说明or被过滤了. ...

  5. 从单个系统到云翼一体化支撑,京东云DevOps推进中的一波三折

    作者:王利莹 采访嘉宾:京东云DevOps团队负责人 郑永宽 今年,IDC 特别针对中国地区发布了<IDC MarketScape:中国 DevOps 云市场2019,厂商评估>研究报告, ...

  6. redis(六)---- 简单延迟队列

    延迟队列的应用场景也很常见,例如:session的超时过期.自动取消未付款订单等等.redis中有一种数据结构叫做zset,即有序集合.元素类型为String类型,且元素具有唯一性不能重复,每个元素可 ...

  7. 51nod1007:正整数分组 DP

    1007 正整数分组 基准时间限制:1 秒 空间限制:131072 KB 分值: 10 难度:2级算法题  收藏  关注 将一堆正整数分为2组,要求2组的和相差最小. 例如:1 2 3 4 5,将1 ...

  8. Django项目同步到码云

    本篇博客主要记录下将刚刚初始化后的Django项目部署到码云中,首先我们需要到码云中注册一个账号,下面会讲解下如何在码云中建立一个仓库,再将其克隆到本地.最后将本地的项目推送到码云的仓库中. 码云内初 ...

  9. vue form 验证

    vue 验证 <Form :model="formModel" label-position="center" :label-width="90 ...

  10. 存储基本概念(lun,volume,HBA,DAS,NAS,SAN,iSCSI,IPSAN)

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/liukuan73/article/det ...