vue 处理日期格式

最新推荐文章于 2024-05-05 22:43:13 发布

悟世君子

最新推荐文章于 2024-05-05 22:43:13 发布

阅读量3.3k

点赞数 1

分类专栏： vue

本文链接：https://blog.csdn.net/wsjzzcbq/article/details/94581138

版权

vue 专栏收录该内容

28 篇文章 6 订阅

订阅专栏

<!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript" src="js/vue.min.js" ></script>
    </head>
    <body>
        <div id="app">
            {{date}}
            <br>
            {{date | formatDate}}
        </div>
        <script type="text/javascript">
            padDate = (value)=> {
                return value < 10 ? '0' + value : value;
            }
            var v = new Vue({
                el: "#app",
                data: {
                    date: '2019-06-29T05:15:15.000+0000'
                },
                methods: {	
                },
                filters: {
                    formatDate: function (value) {  //这里的 value 就是需要过滤的数据
                        var date= new Date(value);
                        var year= date . getFullYear() ;
                        var month= padDate(date.getMonth() + 1) ;
                        var day= padDate(date . getDate());
                        var hours= padDate(date . getHours());
                        var minutes = padDate (date .getMinutes ());
                        var seconds = padDate (date .getSeconds ());
                        return year + '-' + month +'-' + day + ' ' + hours + ':' +minutes +':' + seconds;
                    }
                }
            })
        </script>
    </body>
</html>

运行效果

悟世君子

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
打赏
0
评论
vue 处理日期格式

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/vue.min.js" ><...
复制链接

扫一扫