您的位置:首页 > 产品设计 > UI/UE

vue实现自定义过滤器之时间格式自定义

2018-02-02 20:16 736 查看
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--    <title>过滤器</title>-->
<title>自定义过滤器</title>
</head>
<script src="/vue.min.js"></script>
<body>
<!--<div id="app">-->
<!--{{list| json| uppercase }}-->
<!--</div>-->

<div id="app">
{{time|datefmt}}
</div>
</body>
<script>
//    new Vue({
//        el:'#app',
//        data:{
//            list:[{uname:'itcase'},{uname:'heima'}]
//        }
//    });
new Vue({
el:'#app',
data:{
time:new Date()
},
//在某一个vue对象里定义的过滤器为私有过滤器
//这种过滤器只有在当前vue对象el指定的监管的区域有用
//接下来定义过滤器
filters:{
//input是自定义的过滤器的默认参数,input的值永远都是取自于|左边的内容
datefmt:function (input) {
//过滤器的逻辑:将input的值格式化成这种yyy-mmm-ddd字符串输出
var res="";
var year=input.getFullYear();
var month=input.getMonth()+1;
var day=input.getDate();
res=year+'-'+month+'-'+day;
return res;//返回我们格式化以后的东西

}
}
});
</script>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: