时间戳的格式过滤

363 阅读1分钟

前言

提示:以下是本篇文章正文内容,下面案例可供参考

  • 返回年-月-日 时:分:秒
  return `${y}-${m}-${d} ${hh}:${mm}:${ss}`
  • 返回年-月-日
  return `${y}-${m}-${d}`
// 当作单独的 外部工具使用
/**
 * 过滤时间(时间处理)
 * @param {*} date
 */
export function  mapTime (date) {
    const nDate = new Date(date)
    const y = nDate.getFullYear()
    const m = (nDate.getMonth() + 1 + '').padStart(2, '0')
    const d = (nDate.getDate() + '').padStart(2, '0')
    const hh = (nDate.getHours() + '').padStart(2, '0')
    const mm = (nDate.getMinutes() + '').padStart(2, '0')
    const ss = (nDate.getSeconds() + '').padStart(2, '0')
    return `${y}-${m}-${d} ${hh}:${mm}:${ss}`
  }
  

在 结合ElementUI 框架的Vue项目中使用filter

<template>
 <div>
	</el-table>
	<el-table-column align="center" label="处理时间" width="180">
	 <template slot-scope="scope">
	      {{ scope.row.createDate | mapTime }}
	 </template>
	</el-table-column>
	</el-table>
 </div>
</template>
export default {
  data(){
	return{
	 datalist:[
	 createDate:''
	]
	}
  },
  filters: {
    mapTime,
  },
  }
 

Element UI 和vue的项目中的另一种时间过滤方式

<template>
 <div>
	</el-table>
		 <el-table-column
		  prop="createDate"
		  label="申请时间"
		 :formatter="dateFormatter"
		  header-align="center"
		  align="center"
		 ></el-table-column>
	</el-table>
 </div>
</template>

export default {
  data(){
	return{
	 datalist:[
		 createDate:''
		]
	}
  },
 methods:{
    dateFormatter (row, column) {
      if (row[column.property] != null) {
        return this.$moment(row[column.property]).format('YYYY-MM-DD HH:mm:ss')
      }
    },
  }