vue中使用moment把時間戳 格式化爲 時間格式 (YYYY-MM-DD)

1 首先在vue項目中

npm install moment --save

2. 定義時間格式化全局過濾器
在main.js中或組件中導入該組件

 import moment from 'moment'

3. 用法一
在全局中定義時間格式化
在main.js中引入moment

// 定義一個全局過濾器實現日期格式化
Vue.filter('datefmt', function (input, fmtstring) {
  return moment.unix(input).format(fmtstring)
})

這樣就可以在我們需要對時間進行格式化的組件中進行使用了,如下:

<div>
    <span>{{item.publishdate | datefmt('MM/DD')}}</span>
    <span>{{item.publishdate | datefmt('YYYY')}}</span>
</div>

這裏我有兩個span標籤,第一個是將時間戳格式爲 月/日(11/24) 這樣的格式,第二個則是格式化爲年份值(如2018這樣的)

4.用法二:

如果我們項目所需的格式都是統一格式的(例如都顯示爲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>

5.用法三
在vue methods方法中使用

const data  =  moment(時間戳).format('YYYY-MM-DD HH:mm:ss')
console.log(data)   //    "2019-05-25 08:23:56"

6 . 時間轉時間戳
直接把字符串傳到Date對象裏他會幫你轉成時間的

var timeStr1 = '2018/08/08';

var timeStr2 = '2018/12/12';

var time1 = new Date(timeStr1).getTime();

var time2 = new Date(timeStr2).getTime();

 console.log(time1 )  //   1558972800000
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章