vue中过滤器有什么作用及详解,vue过滤器用法
本文主要详细介绍了Vue的滤波器。本文中的示例代码非常详细，具有一定的参考价值。感兴趣的朋友可以参考一下，希望能帮到你。
:
目录
1.过滤器1.1对过滤器1.2的理解全局过滤器：1.3局部过滤器：1.4过滤器的案例总结
1. 过滤器
万一用时间格式相关的API。
1.1 对过滤器的理解
定义:格式化要显示的数据后，显示。
适用:做一些简单的逻辑处理
特点:过滤器可以做一些简单的操作，在不改变原有数据的情况下，生成新的对应数据。
1. 语法 ： data 过滤器
如果参数没有传入，默认传入数据值，自动调用函数，函数接收值。
传递参数不会覆盖第一个参数，默认情况下，第一个参数是value，第二个参数是传递的参数。
2. 滤器可以以串联的形式
数据过滤器过滤器
执行顺序是数据作为参数传入第一个过滤器，第一个过滤器处理后返回。
值作为第二个过滤器的参数
1.2 全局过滤器：
Vue.filter(filterName，function(value){
返回值. slice(0，4)；
})
新Vue({。
.
.
})
1.3 局部过滤器：
新Vue{
过滤器：{
filterName(值){
返回值. slice(0，4)；
}
}
}
在html中使用过滤器
div { { handle data filtername } }/div
div { { handle data filtername(parameter)} }/div
1.4 过滤器的案例
div id=root
H3methods写道：{{time()}}/h3
由h3computed编写的H3:{ { time 1 } }/H3
H3滤波器写的是：{ { number ftime( yyyy-mm-DD HH:mm:ss ) qjtime } }/H3
/div
div id=root2
整点
h3{{name qjtime}}/h3
/div
脚本
Vue.config.productionTip=false
//全局过滤器
Vue.filter(qjtime ，function (val) {
返回val.slice(0，4)
})
让vm=new Vue({
el: #root ，
数据：{
number: Date.now()
},
方法：{
时间(){
返回js (this.number)。格式( YYYY MM DD HH:mm:ss )
}
},
计算：
{
时间1: {
get() {
返回js (this.number)。格式( YYYY MM DD HH:mm:ss )
}
}
},
//本地过滤器
过滤器：
{
//这是ES的语法，意思是如果有传递的参数，就使用传递的参数；如果没有传递的参数，将使用它们。
Ftime(val，str=YYYY MM月DD日HH:mm:ss) {
返回日期(val)。格式(字符串)
},
}
})
新Vue({
埃尔： #根2 ，
数据：{
number: Date.now()，
名字：“我是第二个Vue”
}
})
/脚本
总结
这就是我们今天要讲的内容。本文介绍了一些关于滤镜的相关知识，希望对你有所帮助！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。