时间格式化 --vue filter方法

最新推荐文章于 2024-07-22 16:40:45 发布

Song757

最新推荐文章于 2024-07-22 16:40:45 发布

阅读量506

点赞数

文章标签： vue 时间格式化

本文链接：https://blog.csdn.net/qq_40119067/article/details/82186176

版权

时间格式化 –vue filter方法

在使用new Date()函数时，出现的时间日期不符合我们的正常格式
这里写图片描述

按照日期格式格式化后应为
这里写图片描述

所以在Vue中添加过滤器代码为

 <div id="app">
        {{birthday | dataFormat}}
 </div>

<script>
    var app = new Vue({
        el:"#app",
        data:{
           birthday:new Date()
        },
        filters:{
            // yyyy-MM-dd hh:mm:ss
            dataFormat: function (date) {
                    var date = new Date(date);
                    var y = date.getFullYear();
                    var M = date.getMonth() + 1;
                    var d = date.getDate();
                    var h = date.getHours();
                    var m = date.getMinutes();
                    var s = date.getSeconds();

                    //格式补0，不要求可以不加
                    //M = M < 10 ? '0' + M : M.toString();
                    //d = d < 10 ? '0' + d : d.toString();
                    //h = h < 10 ? '0' + h : h.toString();
                    //m = m < 10 ? '0' + m : m.toString();
                    //s = s < 10 ? '0' + s : s.toString();

                    return `${y}-${M}-${d} ${h}:${m}:${s}`
                }
        }
    })
    </script>