需求：我們要給用戶展示的時(shí)間格式是2018-06-14 08:08:08鹏溯，但是后臺(tái)存儲(chǔ)使用的格式是時(shí)間戳扑庞。
第一步在vue項(xiàng)目的src目錄下新建common文件夾，在common文件下新建一個(gè)filters文件夾携栋，在filters文件夾下新建一個(gè)index.js文件砚著。
（個(gè)人習(xí)慣請自行靈活操作不必死搬硬套祷蝌。個(gè)人習(xí)慣把過濾器茅撞，公共方法，自定義指令等等都放在common文件下巨朦。）
index.js文件夾內(nèi)容
const dateFilter= (time) => {
????if (!time) { // 當(dāng)時(shí)間是null或者無效格式時(shí)我們返回空
????????return ' '
????} else {
????????const date = new Date(time) // 時(shí)間戳為10位需*1000米丘，時(shí)間戳為13位的話不需乘1000
????????const dateNumFun = (num) => num < 10 ? `0${num}` : num // 使用箭頭函數(shù)和三目運(yùn)算以及es6字符串的簡單操作。因?yàn)橹挥幸粋€(gè)操作不需要{} 糊啡，目的就是數(shù)字小于10拄查，例如9那么就加上一個(gè)0，變成09棚蓄，否則就返回本身堕扶。
? ? // 這是es6的解構(gòu)賦值碍脏。
????const [Y, M, D, h, m, s] = [
????????????????date.getFullYear(),
????????????????dateNumFun(date.getMonth() + 1),
????????????????dateNumFun(date.getDate()),
????????????????dateNumFun(date.getHours()),
????????????????dateNumFun(date.getMinutes()),
????????????????dateNumFun(date.getSeconds())
? ? ? ? ]
????????return `${Y}-${M}-${D} ${h}:${m}:${s}` // 一定要注意是反引號，否則無效稍算。
????}
}}
export { dateFilter}
main.js 注冊成全局
import * as custom from '@/common/filters' // 引入我們剛剛創(chuàng)建的文件
// 全局注冊
Object.keys(custom).forEach(key => { Vue.filter(key, custom[key])})
組件中使用
{{ res.date | dateFilter?}}?
大概就是這種效果：如果后臺(tái)字段傳過來時(shí)是1526634392000典尾，過濾之后就變成了?2018-05-18 17:06:32
若有不解歡迎留言。
