vue利用过滤器对时间进行格式化
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>24-Vue-自定义全局过滤器</title>
<script src="js/vue.js"></script>
</head>
<body>
<!--
需求: 利用过滤器对时间进行格式化
-->
<!--这里就是MVVM中的View-->
<div id="app">
<p>{{time | dateFormart("yyyy-MM-dd")}}</p>
</div>
<script>
/*
注意点: 在使用过滤器的时候, 可以在过滤器名称后面加上()
如果给过滤器的名称后面加上了(), 那么就可以给过滤器的函数传递参数
* */
Vue.filter("dateFormart", function (value, fmStr) {
// console.log(fmStr);
let date = new Date(value);
let year = date.getFullYear();
let month = date.getMonth() + 1 + "";
let day = date.getDate() + "";
let hour = date.getHours() + "";
let minute = date.getMinutes() + "";
let second = date.getSeconds() + "";
if(fmStr && fmStr === "yyyy-MM-dd"){
return `${year}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`;
}
return `${year}-${month.padStart(2, "0")}-${day.padStart(2, "0")} ${hour.padStart(2, "0")}:${minute.padStart(2, "0")}:${second.padStart(2, "0")}`;
});
// 这里就是MVVM中的View Model
let vue = new Vue({
el: '#app',
// 这里就是MVVM中的Model
data: {
time: Date.now()
},
// 专门用于存储监听事件回调函数
methods: {
},
// 专门用于定义计算属性的
computed: {
}
});
</script>
</body>
</html><< 上一篇
下一篇 >>