过滤器-定义私有过滤器
目录
一、全局过滤器
一、全局过滤器
<div id=”app”>
</div>
{{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>
演示结果：
上面属于 app1 ，下面属于app2，这两个不属于一个vm对象，分别由各自的 vm 对象来控制。
在全局过滤器中所有的 vm 实例都能够共享。
二、自定义私有过滤器
给 vm2 自定义一个私有的过滤器
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)
}
}
}
} )
调用过滤器时，采用的是就近原则，如果私有过滤器和全局过滤器名称一致，则优先调用私有过滤器。
