vue 处理日期格式

傷城~ 2021-12-14 15:55 348阅读 0赞

<!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>

运行效果

![20190703174039711.png][]

[20190703174039711.png]: /images/20211214/4b712748a91d40e79a6c9a13cd660747.png

发表评论取消回复

表情：

评论列表（有 0 条评论，348人围观）

还没有评论，来说两句吧...

相关阅读

相关 new Date() 日期格式处理

Date 对象常用API var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) my

浅浅的花香味﹌/ 2023年10月11日 15:07/ 0 赞/ 76 阅读

相关 iView + Vue，DatePicker选择日期格式处理与根据日期查询表单数据

属于个人笔记，没写demo，直接从个人的项目上面截取一部分 1.DatePicker里面的日期格式是国际的，要用format修改其中的格式 2.日期范围选择查询表单数据展示

ゝ一世哀愁。/ 2023年06月23日 13:15/ 0 赞/ 11 阅读

相关日期格式处理

文章目录前言一、时间的长整数表示二、日期类三、java.util.Date、SimpleDateFormat、Local的主要用法

冷不防/ 2023年01月10日 10:19/ 0 赞/ 260 阅读

相关【python】字符串日期格式数据处理

文章目录前言 datetime datetime处理字符串时间数据 pandas.to\_datetime to\_datet

秒速五厘米/ 2022年12月09日 01:54/ 0 赞/ 316 阅读

相关 VUE 格式化日期格式

// 格式化日期格式 1 filters: { formatDate: function (value) {

清疚/ 2022年12月04日 07:53/ 0 赞/ 289 阅读

相关 vue之指定显示日期格式

{ label: '到货日期', prop: 'aogTime', type: 'datetime',

短命女/ 2022年05月10日 12:34/ 0 赞/ 266 阅读

相关 datatables 处理日期格式

datatables 在前端处理日期格式，在列上添加自定义函数即可，代码如下 columns: [ {

亦凉/ 2021年12月14日 16:59/ 0 赞/ 450 阅读

相关 vue 处理日期格式

<!DOCTYPE html> <html> <head> <meta charset="UTF-8">

傷城~/ 2021年12月14日 15:55/ 0 赞/ 349 阅读

相关 poi处理excel自定义日期格式

poi读取excel自定义时间类型时，读取到的是CELL\_TYPE\_NUMERIC，即数值类型，这个时候如果直接取值的话会发现取到的值和表格中的值不一样，这时应

落日映苍穹つ/ 2021年12月09日 06:15/ 0 赞/ 597 阅读

相关 JS中new Date()日期格式处理

1. `var myDate = new Date();` 2. `myDate.getYear(); //获取当前年份(2位)` 3. `myDate.getFullY

r囧r小猫/ 2021年11月11日 09:22/ 0 赞/ 1154 阅读