vue中插值表达式中时间转换yyyy-MM-dd HH:mm:ss

vue插值表达式中将时间转换两种方式：
一、定义方法

<div id="app">当前实时时间:{{dateFormat(date)}}</div>

 

//时间格式化函数，此处仅针对yyyy-MM-dd hh:mm:ss 的格式进行格式化
dateFormat(time) {
    var date=new Date(time);
    var year=date.getFullYear();
/* 在日期格式中，月份是从0开始的，因此要加0
* 使用三元表达式在小于10的前面加0，以达到格式统一 如 09:11:05
* */
    var month= date.getMonth()+1<10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
    var day=date.getDate()<10 ? "0"+date.getDate() : date.getDate();
    var hours=date.getHours()<10 ? "0"+date.getHours() : date.getHours();
    var minutes=date.getMinutes()<10 ? "0"+date.getMinutes() : date.getMinutes();
    var seconds=date.getSeconds()<10 ? "0"+date.getSeconds() : date.getSeconds();
// 拼接
    return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
}    

　　

二、定义过滤器

1. 　　引入moment依赖

   npm install moment --save
   

   　　

2. main.js中全局引用并定义过滤器

   import moment from 'moment'
   //全局过滤器
   Vue.filter('dateFmt', (input, formatString = "YYYY-MM-DD") => {
       return moment(input).format(formatString)
   })
   

   　　

3. 组件插值表达式中使用

   <div id="app">当前实时时间:{{date|dateFmt('YYYY-MM-DD HH:mm:ss')}}</div>