vue將毫秒數(shù)轉(zhuǎn)化為正常日期格式的實(shí)例
更新時(shí)間：2018年09月16日 10:10:12 作者：小穗子
今天小編就為大家分享一篇vue將毫秒數(shù)轉(zhuǎn)化為正常日期格式的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
過(guò)濾器-時(shí)間戳轉(zhuǎn)化
第一步：定義過(guò)濾器，filters.js
export function formatDate (date, fmt) {
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
}
let o = {
'M+': date.getMonth() + 1,
'd+': date.getDate(),
'h+': date.getHours(),
'm+': date.getMinutes(),
's+': date.getSeconds()
};
for (let k in o) {
if (new RegExp(`(${k})`).test(fmt)) {
let str = o[k] + '';
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str));
}
}
return fmt;
};
function padLeftZero (str) {
return ('00' + str).substr(str.length);
};
第二步：在所用之處引入filters.js
import {formatDate} from '../../common/filters.js'
第三步：使用
filters:{
formatDate(time){
var data = new Date(time);
return formatDate(data,'yyyy-MM-dd');
}
},
<span>{{item.rateTime | formatDate}}</span>
以上這篇vue將毫秒數(shù)轉(zhuǎn)化為正常日期格式的實(shí)例就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Vue中import from@符號(hào)指的是什么意思
這篇文章主要介紹了Vue中import from@符號(hào)指的是意思,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
vue實(shí)現(xiàn)前端展示后端實(shí)時(shí)日志帶顏色示例詳解
這篇文章主要為大家介紹了vue實(shí)現(xiàn)前端展示后端實(shí)時(shí)日志帶顏色示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-11-11
vue3+vite自定義封裝vue組件發(fā)布到npm包的全過(guò)程
當(dāng)市面上主流的組件庫(kù)不能滿足我們業(yè)務(wù)需求的時(shí)候,那么我們就有必要開發(fā)一套屬于自己團(tuán)隊(duì)的組件庫(kù),下面這篇文章主要給大家介紹了關(guān)于vue3+vite自定義封裝vue組件發(fā)布到npm包的相關(guān)資料,需要的朋友可以參考下2022-09-09
Vue2.x 項(xiàng)目性能優(yōu)化之代碼優(yōu)化的實(shí)現(xiàn)
這篇文章主要介紹了Vue2.x 項(xiàng)目性能優(yōu)化之代碼優(yōu)化的實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03
vue3.0+element Plus實(shí)現(xiàn)頁(yè)面布局側(cè)邊欄菜單路由跳轉(zhuǎn)功能
這篇文章主要介紹了vue3.0+element Plus實(shí)現(xiàn)頁(yè)面布局，側(cè)邊欄菜單路由跳轉(zhuǎn),需要的朋友可以參考下2023-07-07
vue+echarts實(shí)現(xiàn)可拖動(dòng)節(jié)點(diǎn)的折線圖（支持拖動(dòng)方向和上下限的設(shè)置）
制作一個(gè)折線圖用于顯示當(dāng)前24小時(shí)的數(shù)據(jù)，并且可以通過(guò)拖動(dòng)折現(xiàn)圖設(shè)置數(shù)據(jù)，接下來(lái)通過(guò)本文給大家分享vue+echarts實(shí)現(xiàn)可拖動(dòng)節(jié)點(diǎn)的折線圖（支持拖動(dòng)方向和上下限的設(shè)置），感興趣的朋友跟隨一起學(xué)習(xí)吧2019-04-04
詳解使用jest對(duì)vue項(xiàng)目進(jìn)行單元測(cè)試
這篇文章主要介紹了詳解使用jest對(duì)vue項(xiàng)目進(jìn)行單元測(cè)試，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-09-09
Vue項(xiàng)目實(shí)現(xiàn)文件下載進(jìn)度條功能
大文件下載,花費(fèi)的時(shí)間比較長(zhǎng),沒(méi)有任何提示,用戶體驗(yàn)很差,需要優(yōu)化,提示文件在下載中,并且顯示進(jìn)度百分比,下面小編給大家?guī)?lái)了Vue項(xiàng)目實(shí)現(xiàn)文件下載進(jìn)度條功能,感興趣的朋友一起看看吧2024-03-03
vue自定義js圖片碎片輪播圖切換效果的實(shí)現(xiàn)代碼
這篇文章主要介紹了vue自定義js圖片碎片輪播圖切換效果的實(shí)現(xiàn)代碼,需要的朋友可以參考下2019-04-04
html5-qrcode是一個(gè)基于JavaScript?輕量級(jí)和跨平臺(tái)的掃碼插件,允許用戶使用攝像頭掃描二維碼,并且解析為文本或者url,本文給大家介紹了vue實(shí)現(xiàn)h5掃碼,需要的朋友可以參考下2024-01-01