学习vue第七节，filter过滤器如何的使用
vue 过滤器如何的使用
1.全局过滤器
2.私有过滤器
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/vue-2.4.0.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="app">
<!-- 1.过滤选择器基本使用,调用方法，默认传参msg {{name | 过滤选择器名称}} -->
<p>{{msg | msgFormat1}}</p>
<!-- 过滤选择器 可以传自己的参数-->
<p>{{msg | msgFormat2("b")}}</p>
<!-- 过滤选择器 可以多次调用-->
<p>{{msg | msgFormat2("b") | other}}</p>
</div>
<script type="text/javascript">
// 全局过滤选择器 ，msg 默认传过来的参数
Vue.filter("msgFormat1",function(msg){
return msg+"aa"
})
Vue.filter("msgFormat2",function(msg,b){
// 可以加正则表达式 /2/g 全局匹配
return msg.replace(/2/g,"a"+b)
})
Vue.filter("other",function(msg){
// 调用完msgFormat2 再调用other
return msg+" over"
}) var vm=new Vue({
el:"#app",
data:{
msg:"123412341234"
},
methods:{ },
filters:{//定义 私有过滤器
msgFormat1:function(msg){//同样的过滤器msgFormat1 优先调用私有过滤器
return `${msg}bb`;//ES6字符串连接方法
}
}
}) </script>
</body>
</html>
学习vue第七节，filter过滤器如何的使用的更多相关文章
- javaweb学习总结(四十二)——Filter(过滤器)学习
一.Filter简介 Filter也称之为过滤器,它是Servlet技术中最激动人心的技术,WEB开发人员通过Filter技术,对web服务器管理的所有web资源:例如Jsp, Servlet, 静态 ...
- javaWeb学习总结（10）- Filter(过滤器)学习
一.Filter简介 Filter也称之为过滤器,它是Servlet技术中最激动人心的技术,WEB开发人员通过Filter技术,对web服务器管理的所有 web资源:例如Jsp, Servlet, 静 ...
- javaweb学习总结(四十六)——Filter(过滤器)常见应用
一.统一全站字符编码 通过配置参数charset指明使用何种字符编码,以处理Html Form请求参数的中文问题 1 package me.gacl.web.filter; 2 3 import ja ...
- javaWeb学习总结（10）- Filter(过滤器)常见应用(3)
一.统一全站字符编码 通过配置参数charset指明使用何种字符编码,以处理Html Form请求参数的中文问题 package me.gacl.web.filter; import java.io. ...
- javaWeb学习总结（10）- Filter(过滤器)学习（2）
在filter中可以得到代表用户请求和响应的request.response对象,因此在编程中可以使用Decorator(装饰器)模式对request.response对象进行包装,再把包装对象传给目 ...
- JavaWeb学习（二十三）———Filter(过滤器)
一.Filter简介 Filter也称之为过滤器,它是Servlet技术中最激动人心的技术,WEB开发人员通过Filter技术,对web服务器管理的所有web资源:例如Jsp, Servlet, 静态 ...
- shiro框架学习-6-Shiro内置的Filter过滤器及数据加解密
1. shiro的核心过滤器定义在枚举类DefaultFilter 中,一共有11个 ,配置哪个路径对应哪个拦截器进行处理 // // Source code recreated from a .c ...
- Java Web学习总结（12）Filter过滤器
一,Filter简介 Filter也称之为过滤器,Filter是对客户端访问资源的过滤,符合条件放行,不符合条件不放行,并且可以对目标资源访问前后进行逻辑处理. 二,Filter开发步骤 1)编写一个 ...
- 学习vue第六节，v-if和v-show
vue 中的v-if和v-show <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...
随机推荐
- 奥卡姆剃刀原则在ERP项目的应用
一向崇信“奥卡姆剃刀原则”,如非必要,绝不新增. 在我所实施的项目中,自定义字段.自定义报表非常少.很极端的一个例子是,曾经有一家工厂,生产打印机的部件,产品百分之百外销. 在项目实施完成,成功上线后 ...
- Linux c++ vim环境搭建系列（5）——vim使用
5. 使用 5.1 快捷键及设置 5.1.1 光标移动 w : 正向移动到相邻单词的首字符 b : 逆向移动到相邻单词的首字符 e : 正向移动到相邻单词的尾字符 ge : 逆向移动到相邻单词的尾字符 ...
- Centos7 编译安装 Libmcrypt 库
0x00 先下载 libmcrypt 库源码 libmcrypt-2.5.8.tar.gz 或者去这里 libmcrypt 下载你需要的版本. 0x01 将下载的源码解压到文件夹 tar -zxvf ...
- Linux-设备
一.在Linux系统中,每个设备都被当成一个文件来对待. 在Linux系统中,几乎所有的硬件设备都在/dev这个目录内.
- G. 蚂蚁的镜像串
单点时限: 1.0 sec 内存限制: 512 MB 一只聪明的蚂蚁在学习了回文串之后,一直觉得回文串不够优美,所以它决定自己定义一种新的字符串——镜像串 所谓镜像串,就是对一个字符串进行一整个完全的 ...
- 格式化启动盘win10
我这个(U盘)磁盘被分成了两个区,不能直接格式化 第一步: 第二步: 删除完了之后,选择格式化,ok. 说明:格式化时要选择系统. 常规NTFS 缺点:老设备,比如打印机,监控机识别不了. FAT系 ...
- 详解 I/O流
I/O流是用于处理设备之前信息传输的流,在我们今后的学习甚至是工作中,都是十分重要的. 在我们的日常生活中,也是很常见的,譬如:文件内容的合并.设备之键的文件传输,甚至是下载软件时的断点续传,都可以用 ...
- 一站式轻量级框架 Spring
Spring 简介 Spring 是一个轻量级的 Java 开发框架,它是为了解决企业应用开发的复杂性而创建的.Spring 的核心是控制反转(IoC)和面向切面编程(AOP).简单来说,Spring ...
- 解决centos ping不通外网
先确认三件事: 一.ip 二.网关 三.dns 一就不说了,设置好本地ip和掩码就行了,二网关 添加默认网关,命令:route add defaule gw 192.168.1.1 这是 你用ro ...
- 每天都在用，但你知道 Tomcat 的线程池有多努力吗？
这是why的第 45 篇原创文章.说点不一样的线程池执行策略和线程拒绝策略,探讨怎么让线程池先用完最大线程池再把任务放到队列中. 荒腔走板 大家好,我是 why,一个四川程序猿,成都好男人. 先是本号 ...