vue 中过滤器实现:
在script 脚本中引用:
<script type="text/javascript" src="../js/dayjs.min.js"></script>
<div id="root">
<h2>显示格式化之后的时间</h2>
// 计算属性实现
<h2>显示格式化之后的时间</h2>
methods 实现
<h2>显示格式化之后的时间</h2>
// 过滤器实现
<h2>显示格式化之后的时间</h2>
<h3>现在是: {{time | timeFormatter}}</h3>
</div>
<script>
// 局部过滤器(局部过滤器就是在当前创建的vue 的实例对象上使用, 配置项就是filters)
// 过滤器的本质就是函数 | 过滤器的符号就是 | 管道符 把前边的参数当做后边过滤器的参数进行传递。
filters: {
timeFormatter() {
return (返回值就可以把插值表达式中的值替换掉)
}
}
过滤器的第一个参数就是亘古不变的 | 管道符之前的数据
可以实现多个过滤器的串联, filters 可以实现对各过滤器的串联:
但是定义为全局过滤器 直接定义在vue身上 vue.filter('myslice', function(value) {
return value.slice(0, 4)
})
全局过滤器必须在new vue 实例对象之前
</script>
vue 中过滤器
最新推荐文章于 2023-02-28 21:06:09 发布
![](https://img-home.csdnimg.cn/images/20240711042549.png)