vue+moment.js使用

vue+momentjs時間格式化

vue項目

npm install moment --save

main.js 引入註冊

// 導入時間插件momentjs
import moment from 'moment'

// 定義時間格式全局過濾器
Vue.filter('dateFormat', function (daraStr, pattern = 'YYYY-MM-DD HH:mm:ss') {
  return moment(daraStr).format(pattern)
})

模板中使用

<!-- 顯示2019-12-05 10:10 -->
 <div class="time">{{nowDate | dateFormat('YYYY-MM-DD HH:mm')}}</div>
 <!-- 顯示10:10 -->
 <div class="time">{{nowDate | dateFormat('HH:mm')}}</div>
 <!-- 顯示2019-12-05 10:10:10 -->
 <div class="time">{{nowDate | dateFormat}}</div>

---

除了以上全局導入的方法外，還能夠單個組件引入
直接在所須要的組件中引入就能夠了

<script>
let moment = require("moment") // 引入
export default {
    data() {
        return {
            nowDate:new Date().getTime()// 獲取時間戳
        }
    },
    created(){
        // 轉換時間格式年月日時分秒
        this.nowDate = moment(this.nowDate).format('YYYY-MM-DD HH:mm')
    }
}
</script>

模板中

<div class="time">{{nowDate}}</div>