日期过滤器示例
Posted kukai
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了日期过滤器示例相关的知识，希望对你有一定的参考价值。
过滤器也可以串联，而且可以接收参数，
例如：串联一一〉{ { message I filterA I fil terB } }
接收参数一一〉{{ message I filterA( ‘argl ‘，‘ arg2 ‘）｝｝
这里的字符串 argl arg2 将分别传给过滤器的第 二个和第 三个参数，因为第 一个是数据本身。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
{{date | formatDate }}
<p>{{isOk?‘确定‘:‘不确定‘}}</p>
</div>
<script>
//数字小于10前面补零
preDate = (value) => {
return value < 10 ? "0" + value : value;
};
var demo = new Vue({
el: "#app",
data: {
date: new Date(),
isOk: false,
},
//过滤器设置
filters: {
//value为需要格式化的数据
formatDate: (value) => {
var date = new Date(value);
var year = date.getFullYear();
var month = preDate(date.getMonth() + 1);
var day = preDate(date.getDate());
return year + "-" + month + "-" + day;
},
},
});
</script>
</body>
</html>
以上是关于日期过滤器示例的主要内容，如果未能解决你的问题，请参考以下文章