js时间格式转化处理,vue.js时间转化为今天,明天,后天显示

2023-10-21 09:59

本文主要是介绍js时间格式转化处理,vue.js时间转化为今天,明天,后天显示,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

前端在日常开发中经常需要对时间进行一系列的处理,比如吧正常时间转化为昨天,今天,明天,后天等方式显示,其余时间显示月份日期,时间等,这时候写一个公共方法来转化,即高效又优雅,话不多说,看代码,注释都在代码里了
在这里插入图片描述
在这里插入图片描述

//后台获取时间列表:
getList() {let project = [{name: "京东当日达",time: "2022-07-04 10:32:16",price: "30.00",},{name: "京东次日达",time: "2022-07-05 11:52:16",price: "26.00",},{name: "京东特快送",time: "2022-07-06 13:30:16",price: "20.00",},{name: "京东超快送",time: "2022-07-08 08:08:16",price: "18.00",},{name: "京东配送",time: "2022-07-12 23:59:16",price: "12.00",}];project.forEach((item) => {item.myTime = this.getTime(item.time);});
},//时间格式进行处理
getTime(strtime) {let date = new Date(strtime.replace(/-/g, "/"));// date 预计送达时间戳date = Date.parse(date); // 转为国际标准时间let time = new Date(parseInt(date)); // 一共相差几天let days = parseInt((date - new Date().getTime()) / 86400000); // 今天是几号let today = new Date().getDate(); let mouth = time.getMonth() + 1;// 预计送达是几号let day = time.getDate(); let hour = time.getHours() < 10 ? "0" + time.getHours() : time.getHours();let min = time.getMinutes() < 10 ? "0" + time.getMinutes() : time.getMinutes();// offset 送达日期-今天日期差let offset = Math.abs(day - today);let obj = {// 日期date: "",// 具体时间time: hour + ":" + min,};// 这里双重判断,第一个判断days < 3是验证是否在同一个月,第二个offset < 3是判断是验证相差是几天if (days < 3 && offset < 3) {if (offset === 0) {obj.date = "今天";} else if (offset === 1) {obj.date = "明天";} else if (offset === 2) {obj.date = "后天";}} else {obj.date = mouth + "月" + day + "日"}return obj;
},

组件经常用到建议收藏,写的比较简单,有复制业务逻辑扩展起来也方便,觉得有用记得一键三连哈!
在这里插入图片描述

这篇关于js时间格式转化处理,vue.js时间转化为今天,明天,后天显示的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/253643

相关文章

Linux虚拟机不显示IP地址的解决方法(亲测有效)

《Linux虚拟机不显示IP地址的解决方法(亲测有效)》本文主要介绍了通过VMware新装的Linux系统没有IP地址的解决方法,主要步骤包括:关闭虚拟机、打开VM虚拟网络编辑器、还原VMnet8或修... 目录前言步骤0.问题情况1.关闭虚拟机2.China编程打开VM虚拟网络编辑器3.1 方法一:点击还原VM

Python中Windows和macOS文件路径格式不一致的解决方法

《Python中Windows和macOS文件路径格式不一致的解决方法》在Python中,Windows和macOS的文件路径字符串格式不一致主要体现在路径分隔符上,这种差异可能导致跨平台代码在处理文... 目录方法 1:使用 os.path 模块方法 2:使用 pathlib 模块(推荐)方法 3:统一使

Java中使用注解校验手机号格式的详细指南

《Java中使用注解校验手机号格式的详细指南》在现代的Web应用开发中,数据校验是一个非常重要的环节,本文将详细介绍如何在Java中使用注解对手机号格式进行校验,感兴趣的小伙伴可以了解下... 目录1. 引言2. 数据校验的重要性3. Java中的数据校验框架4. 使用注解校验手机号格式4.1 @NotBl

CSS模拟 html 的 title 属性(鼠标悬浮显示提示文字效果)

《CSS模拟html的title属性(鼠标悬浮显示提示文字效果)》:本文主要介绍了如何使用CSS模拟HTML的title属性,通过鼠标悬浮显示提示文字效果,通过设置`.tipBox`和`.tipBox.tipContent`的样式,实现了提示内容的隐藏和显示,详细内容请阅读本文,希望能对你有所帮助... 效

Python批量调整Word文档中的字体、段落间距及格式

《Python批量调整Word文档中的字体、段落间距及格式》这篇文章主要为大家详细介绍了如何使用Python的docx库来批量处理Word文档,包括设置首行缩进、字体、字号、行间距、段落对齐方式等,需... 目录关键代码一级标题设置  正文设置完整代码运行结果最近关于批处理格式的问题我查了很多资料,但是都没

基于Python开发PDF转Doc格式小程序

《基于Python开发PDF转Doc格式小程序》这篇文章主要为大家详细介绍了如何基于Python开发PDF转Doc格式小程序,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 用python实现PDF转Doc格式小程序以下是一个使用Python实现PDF转DOC格式的GUI程序,采用T

Python如何实现读取csv文件时忽略文件的编码格式

《Python如何实现读取csv文件时忽略文件的编码格式》我们再日常读取csv文件的时候经常会发现csv文件的格式有多种,所以这篇文章为大家介绍了Python如何实现读取csv文件时忽略文件的编码格式... 目录1、背景介绍2、库的安装3、核心代码4、完整代码1、背景介绍我们再日常读取csv文件的时候经常

Vue中动态权限到按钮的完整实现方案详解

《Vue中动态权限到按钮的完整实现方案详解》这篇文章主要为大家详细介绍了Vue如何在现有方案的基础上加入对路由的增、删、改、查权限控制,感兴趣的小伙伴可以跟随小编一起学习一下... 目录一、数据库设计扩展1.1 修改路由表(routes)1.2 修改角色与路由权限表(role_routes)二、后端接口设计

MySQL 日期时间格式化函数 DATE_FORMAT() 的使用示例详解

《MySQL日期时间格式化函数DATE_FORMAT()的使用示例详解》`DATE_FORMAT()`是MySQL中用于格式化日期时间的函数,本文详细介绍了其语法、格式化字符串的含义以及常见日期... 目录一、DATE_FORMAT()语法二、格式化字符串详解三、常见日期时间格式组合四、业务场景五、总结一、

Gin框架中的GET和POST表单处理的实现

《Gin框架中的GET和POST表单处理的实现》Gin框架提供了简单而强大的机制来处理GET和POST表单提交的数据,通过c.Query、c.PostForm、c.Bind和c.Request.For... 目录一、GET表单处理二、POST表单处理1. 使用c.PostForm获取表单字段:2. 绑定到结