vue中使用moment.js

moment.js

Moment.js 是一个轻量级 JavaScript 日期处理类库，提供了日期格式化、日期解析等功能。它支持在浏览器和 NodeJS 两种环境中运行。此类库能够将给定的任意日期转换成多种不同的格式，具有强大的日期计算功能，同时也内置了能显示多样的日期形式的函数。另外，它也支持多种语言，你可以任意新增一种新的语言包。

npm下载moment.js

npm install moment --save

vue文件中使用moment

• 首先封装一个时间过滤器文件dateFilter.js
• 然后引入vue实例
• 引入moment
• 创建过滤器

import Vue from "vue"
// 引入moment
import moment from "moment"

// 第一个参数是传递过来的时间挂载过滤器的是一个时间戳    
// 第二个参数是挂载的过滤器格式
Vue.filter('dateFormat',function(input,dateFormat){
    // 1592484972321
    console.log(input);
    // YYYY/MM/DD HH:mm:ss 
    console.log(dateFormat);
    return moment(input).format(dateFormat)

}) 

main.js中导入

// 全局引入过滤器
import "./dateFilter.js"

组件中使用

<template>
  <div class="home">
  <!-- 页面显示  2020/06/18 20:58:14 -->
    {{date | dateFormat('YYYY/MM/DD HH:mm:ss ')}}
  </div>
</template>

<script>
export default {
  name: "Home",
  components: {},
  data() {
    return {
      date: new Date().getTime()
    }
  },
  mounted() {
    console.log(this.date);
  },
};
</script>