过滤器-定义私有过滤器|学习笔记

简介: 快速学习过滤器-定义私有过滤器

开发者学堂课程【Vue.js 入门与实战过滤器-定义私有过滤器】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址https://developer.aliyun.com/learning/course/586/detail/8148


过滤器-定义私有过滤器


目录

一、全局过滤器

二、自定义私有过滤器

 

一、全局过滤器


<div id=”app”>
</div>
<div id=”app2”>
{{1+1}}
</div>
<script>
Vue.filter(‘dateformat’,function(datstr,pattern=””){
})
Var vm = new Vue {{
})

因为第一个 div 被 vm 控制,而第二个 div 没有被控制,所以{{1+1}}原样输出。可以创建一个新的 vm 对象,控制 div 

var vm2 = new vue( {
el:'#app2’,//el 是控制的元素
data:{

这样输出结果就为2

输出 vm2 的时间

var vm2 = new vue( {
el:'#app2’,//el 是控制的元素
data:{
dt: new Date()
},
<div id=”app2”>
<h3>{{dt}}</h3>
</div>

演示结果:

image.png

上面属于 app1 ,下面属于app2,这两个不属于一个vm对象,分别由各自的 vm 对象来控制。

在全局过滤器中所有的 vm 实例都能够共享。

 

二、自定义私有过滤器


给 vm2 自定义一个私有的过滤器

var vm2 = new vue( {
el:'#app2’,//el 是控制的元素
data:{
dt: new Date()
},
methods:{}
filters:{// methods和filters都是对象,定义私有过滤器,过滤器有两个条件 【过滤器名称和处理函数】。
Dateformat:function(dateStr,pattern=’’) {
var dt = new Date(datestr)
//每个名称都要对应处理的函数,第一个参数是过滤器传过来的数据,
//yyyy-mm-dd
var y=dt.getrullYear()
var m=dt.getMonth()+1
var d = dt.getDate()
If (pattern.tolower case() ===" yyyy-mm-dd') {
Return ‘$(y)-$(m)-$(d)
} else {
var hh =dt.getHours()
var mm =dt.getMinutes()
var ss = dt.getSeconds()
return“${y}-${m}-${d}  $(hh):$(mm):$(ss) 
}
}
}
} )

调用过滤器时,采用的是就近原则,如果私有过滤器和全局过滤器名称一致,则优先调用私有过滤器。

相关文章
|
4月前
|
JavaScript Java 容器
servlet过滤器Filter简要回顾-过滤请求字符编码,/和/*和/**的区别
本文简要回顾了Servlet过滤器Filter的概念和使用,通过实例演示了如何创建过滤器以过滤请求字符编码,并解释了在web.xml中配置过滤器时使用`/`、`/*`和`/**`的区别。
servlet过滤器Filter简要回顾-过滤请求字符编码,/和/*和/**的区别
|
1月前
|
Java Spring
过滤器实现方式
Spring Cloud Gateway 的过滤器用于处理HTTP请求和响应,支持日志记录、请求转发、权限校验等。内置过滤器如AddRequestHeader、RewritePath、SetStatus等,可自定义以满足特定需求。
27 0
|
8月前
|
Java 数据安全/隐私保护
Filter概述、执行流程、拦截路径配置及过滤器链
Filter概述、执行流程、拦截路径配置及过滤器链
104 0
|
Java 容器
过滤器和拦截器的区别
Filter 也称为过滤器,基于Servlet实现,拦截器(Interceptor)是一种动态拦截方法调用的机制,在SpringMVC中动态拦截控制器方法的执行,基于AOP思想,对方法进行增强。和servlet 中的过滤器类似,都是对用户请求进行处理。
88 0
过滤器简介--操作步骤--过滤器生命周期--过滤器匹配规则-- 过滤器链
过滤器简介--操作步骤--过滤器生命周期--过滤器匹配规则-- 过滤器链
83 0
|
API 微服务
全局过滤器 GlobalFilter
全局过滤器 GlobalFilter
283 0
Filter过滤器概念及生命周期
Filter过滤器概念及生命周期
169 0
|
应用服务中间件
Servlet中的生命周期、基础配置、三种匹配规则、缺省Servlet以及路径问题
Servlet中的生命周期、基础配置、三种匹配规则、缺省Servlet以及路径问题
94 0
|
前端开发
前端学习笔记202303学习笔记第五天-私有过滤器和全局过滤器
前端学习笔记202303学习笔记第五天-私有过滤器和全局过滤器
76 0
|
前端开发 Java 应用服务中间件
GetWay网关过滤器工厂与全局过滤器
GatewayFilter是网关中提供的一种过滤器,可以对进入网关的请求和微服务返回的响应做处理:
367 0