vue js日期时间格式化

前言

使用vue开发中，后台传过来的数据含有时间日期的通常前端都要做进一步做处理或者格式化，常用的是使用filter来过滤数据，换一种思路，前端拿到的时间日期数据一般是一串数字的时间戳，或者是一个字符串的时间日期，所以我们可以在 String 和 Number 里定义一个格式化函数，从而实现格式化时间日期。

// /utils/index.js
function dateFormatInit() {String.prototype.dateFormat = Number.prototype.dateFormat = function(fmt = "yyyy-mm-dd HH:MM:SS") {let date = new Date(this);let fmtDate = fmt;// 转化时间let o = {"y+": date.getFullYear(),"m+": date.getMonth() + 1,"d+": date.getDate(),"H+": date.getHours(),"M+": date.getMinutes(),"S+": date.getSeconds()};for (let key in o) {// 正则let rep = new RegExp(`${key}`);// 是所需要的格式if (rep.test(fmt)) {fmtDate = fmtDate.match(rep) // 有匹配到所对应格式? fmtDate.replace(fmt.match(rep)[0], // 将原来的格式进行值的替换 例如 yyyy - 2019// String(o[key]).padStart(fmt.match(rep)[0].length, "0") // ES2017写法String(o[key]).length === 1 ? `0${o[key]}` : `${o[key]}` // 例 小时为 7 时，在前面加上 0 ，变成 07): "";}}return fmtDate;};
}
dateFormatInit();

// main.js
import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import "@/utils/";Vue.config.productionTip = false;let a = 1560722201293; // 时间戳
let b = "2019/05/05 07:15:10"; // 字符串 时间日期console.log(a.dateFormat("yyyy-mm-dd"));
console.log(b.dateFormat("yyyy-mm-dd HH:MM:SS"));new Vue({router,store,render: h => h(App)
}).$mount("#app");

vue js日期时间格式化相关推荐

js 日期时间格式化,年月日时分秒
1. formatDate.js export function formatDate(date, fmt) {var currentDate = new Date(date);var o = {&q ...
Vue el-date-picker 组件时间格式化方式
Vue el-date-picker 组件时间格式化方式 1.使用el-date-picker组件 <el-form-item label="生日" :label-width ...
php中日期选择代码,实现JS日期时间选择器
这次给大家带来实现JS日期时间选择器,实现JS日期时间选择器的注意事项有哪些,下面就是实战案例,一起来看一下. flatpickr 是一个轻量级.注重精益.由 UX 驱动和可扩展的 JavaScrip ...
Springboot 关于日期时间格式化处理方式总结
点击关注公众号,实用技术文章及时了解来源:juejin.im/post/5e62817fe51d4526d05962a2 项目中使用LocalDateTime系列作为DTO中时间的数据类型,但是Sp ...
java8日期时间格式化与解析
java8日期时间格式化与解析 1. 简述主要介绍LocalDateTime,ZonedDateTime的格式化及解析. 常见带日期时间格式: 字段名字段值 api格式 DateTimeForma ...
js日期时间比较大小
知识点: new Date(Date.parse(时间1)) == new Date(Date.parse(时间2)) 上面的方法可以结合自定义的时间戳比如下面的日期时间格式化函数使用 functi ...
oracle中如何格式化输出,【学习笔记】数据库日期时间格式化输出案例
天萃荷净分享一篇关于开发DBA在工作中常用到的日期时间格式化输出方法案例,含:mysql.sql server.oracle 3种数据库日期时间格式化输出 1.mysql数据库时间格式化输出 DAT ...
react 日期怎么格式化_react中日期时间格式化
项目开发过程当中,总会遇到这样那样的时间格式化问题,那么在react中,日期时间格式化该怎么解决??react 一种是直接使用插件 moment,方便快捷完美的解决时间格式化问题:npm 另外一种是, ...
JS日期时间比较大小（绝对干货）
普通日期时间比较泛指格式相同的日期时间 var date1 = new Date("2020-3-15"); var date2 = new Date("2020-2- ...
java yyyy-mm-dd 日期格式_Java中的日期时间格式化
原标题:Java中的日期时间格式化 1 Java日期时间格式化的概念我们在日常的开发过程中常常会碰到关于日期时间的计算与存储问题,比如我们要把一个当前时间类型转换成字符串类型,我们会直接使用Util ...

vue js日期时间格式化

前言

vue js日期时间格式化相关推荐

最新文章

热门文章