局部过滤器 局部过滤器定义在Vue实例的filters中，必须是一个函数，调用时使用|完成调用。 局部过滤器只能由当前的Vue实例使用。 如下，对时间类型进行过滤： <body> <
局部过滤器
<body>
<div id="app">
{{currentTime | timeFormat}}
</div>
<script src="./vue.js"></script>
<script src="https://cdn.bootcss.com/moment.js/2.24.0/moment.min.js"></script>
<script>
const app = new Vue({
el: "#app",data: {
currentTime: new Date(),},filters: {
timeFormat(value) {
// value就是 | 左边的值
return moment(value).format("YYYY-MM-DD HH:mm:ss");
}
}
})
</script>
</body>
全局过滤器
<body>
<div id="app">
{{currentTime | timeFormat}}
</div>
<script src="./vue.js"></script>
<script src="https://cdn.bootcss.com/moment.js/2.24.0/moment.min.js"></script>
<script>
Vue.filter("timeFormat",value=>{
// value就是 | 左边的值
return moment(value).format("YYYY-MM-DD HH:mm:ss");
})
const app = new Vue({
el: "#app",}
})
</script>
</body>
过滤器参数
<body>
<div id="app">
{{currentTime | addTime(7,"days")}}
</div>
<script src="./vue.js"></script>
<script src="https://cdn.bootcss.com/moment.js/2.24.0/moment.min.js"></script>
<script>
const app = new Vue({
el: "#app",filters: {
addTime(value,...arg) {
// value就是 | 左边的值,arg是右边的两个值
return moment(value).add(...arg).format("YYYY-MM-DD HH:mm:ss");
}
}
})
</script>
</body>
服务热线 19970861797
