因为需求需要,接口传递过来的日期格式是一个时间戳,因此需要进行格式转换,老大给了插件地址,让我自己研究
插件地址:http://momentjs.cn/
因为没有使用过,所有就开始各种百度,参考各位大佬的总结,大概了解了怎么使用,然后记录下来当做个笔记,免得以后搞忘了
(1)首先在项目目录下安装 npm install moment --save
(2)引入moment
在main.js中引入moment
用法一:
import moment from 'moment' // 定义一个全局过滤器实现日期格式化 Vue.filter('datefmt', function (input, fmtstring) { return moment.unix(input).format(fmtstring) })
这样就可以在我们需要对时间进行格式化的组件中进行使用了,如下:
<div class="news-info-date"> <span class="news-date-span">{{item.publishdate | datefmt('MM/DD')}}</span> <span>{{item.publishdate | datefmt('YYYY')}}</span> </div>
这里我有两个span标签,第一个是将时间戳格式为 月/日(11/24) 这样的格式,第二个则是格式化为年份值(如2018这样的)
用法二:
但是如果我们项目所需的格式都是统一格式的(例如都显示为2018-09-06),那么可以在main.js中进行统一格式样式的设置,如下:
Vue.filter('datefmt', function (input, 'YYYY-MM-DD') { return moment.unix(input).format('YYYY-MM-DD') })
然后在组件中这样使用即可:
<span>{{item.publishdate | datefmt}}</span>
总结:如果日期格式都是统一的,那么可以在main.js中进行统一设置(方法二),但如果日期格式有所不同,最好是在使用的组件中根据需要设置日期格式(方法一)。当然了,插件官网上还有其他的一些使用说明,比如获取今天是星期几,几天是这个月的几号这样的格式,根据需要引入格式即可...