JS时间戳转日期格式

在公共文件夹中封装

@/utils/validate.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);
};

在模块中使用

• 过滤器可以用在两个地方：双花括号插值和 v-bind 表达式

    <!-- 数据表格 -->
    <el-table :data="response.data.records" stripe style="width: 100%" border>
      <el-table-column prop="name" label="堆场名称" width="180"></el-table-column>
      <el-table-column prop="updateDate" label="最新更新" width="180">
        <template slot-scope="scope">
          {{scope.row.updateDate | formatDate}}
        </template>
      </el-table-column>
      <el-table-column prop="goodsType" label="货种"></el-table-column>
      <el-table-column prop="areaUsed" label="使用面积（平方米）" width="160"></el-table-column>
      <el-table-column prop="areaCapacity" label="总面积（平方米）" width="160"></el-table-column>
      <el-table-column prop="volumn" label="体积（立方米）" width="160"></el-table-column>
      <el-table-column prop="rateRise" label="相比上日"></el-table-column>
      <el-table-column prop="rateUsage" label="使用负荷" width="180">
        <template slot-scope="scope">
          <el-progress :percentage="scope.row.rateUsage * 100"></el-progress>
        </template>
      </el-table-column>
      <el-table-column>
        <template slot-scope="scope">
          <el-button @click="openDetail" type="primary" round>详情</el-button>
        </template>
      </el-table-column>
    </el-table>

• 引入封装好的js文件
• 在组件中定义本地的过滤器

<script>
	import api from "@/api/modules/space";
	import { formatDate } from '../../utils/validate.js';
	export default {
		filters: {
		    formatDate(time) {
		        var date = new Date(time);
		        return formatDate(date, 'yyyy-MM-dd hh:mm');
		    }
		  },
	    methods: {
			async getStorageYard() {
		      this.response = await api.getStorageYard(this.search);
		      console.log(this.response);
		    }
	    },
	    mounted() {
	      this.getStorageYard();
	    }
    }
</script>

页面渲染结果