tnblog
首页
视频
资源
登录

day.js 获取上月,当月,下月。day.js 获取年月日。获取一周、上周、本月、上月、本季度、上季度时间段。时间格式化

6410人阅读 2023/8/21 10:50 总访问:690405 评论:0 收藏:0 手机
分类: 前端

官网:https://dayjs.fenxianglu.cn/
Element-plus中可以直接使用:

  1. import { dayjs } from 'element-plus'

day.js 时间格式化

  1. dayjs().format(); // 2020-09-08T13:42:32+08:00
  2. dayjs().format('YYYY-MM-DD'); // 2020-09-08
  3. dayjs().format('YYYY-MM-DD HH:mm:ss'); // 2020-09-08 13:47:12
  4. dayjs(1318781876406).format('YYYY-MM-DD HH:mm:ss'); // 2011-10-17 00:17:56
  5. dayjs(this.createDate).format('YYYY 年 MM 月 DD 日');
  6. dayjs(this.createDate).format('YYYY年MM月DD日');
  7. dayjs(this.createDate).format('YYYY/MM/DD');

传递从接口中来的数据:

  1. dayjs(item.completeDateTime).format('YYYY-MM-DD HH:mm:ss')
element table 表格时间格式化
  1. <el-table-column prop="createTime" label="创建时间" show-overflow-tooltip>
  2. <template #default="scope">
  3. <span>{{dayjs(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span>
  4. </template>
  5. </el-table-column>

day.js 获取上月,当月,下月

  1. onMounted(() => {
  2. // 获取下月
  3. let nextMonth = dayjs().add(1, 'month').format('YYYY-MM')
  4. alert(nextMonth)
  5. // 当月
  6. let nowMonth = dayjs().format('YYYY-MM');
  7. alert(nowMonth)
  8. // 获取上月
  9. let lastMonth = dayjs().add(-1, 'month').format('YYYY-MM')
  10. alert(lastMonth)
  11. getLevelList()
  12. })

dayjs取 本周、上周、本月、上月、本季度、上季度时间段参考

  1. let dateTimes = [
  2. {
  3. id: 1,
  4. name: '本周',
  5. start_time: dayjs().startOf('week').add(1, 'day').format('YYYY-MM-DD'),
  6. end_time: dayjs().endOf('week').add(1, 'day').format('YYYY-MM-DD'),
  7. },
  8. {
  9. id: 2,
  10. name: '上周',
  11. start_time: dayjs().add(-1, 'week').startOf('week').add(1, 'day').format('YYYY-MM-DD'),
  12. end_time: dayjs().add(-1, 'week').endOf('week').add(1, 'day').format('YYYY-MM-DD'),
  13. },
  14. {
  15. id: 3,
  16. name: '本月',
  17. start_time: dayjs().startOf('month').format('YYYY-MM-DD') ,
  18. end_time: dayjs().endOf('month').format('YYYY-MM-DD'),
  19. },
  20. {
  21. id: 4,
  22. name: '上月',
  23. start_time: dayjs().add(-1, 'month').startOf('month').format('YYYY-MM-DD') ,
  24. end_time: dayjs().add(-1, 'month').endOf('month').format('YYYY-MM-DD'),
  25. },
  26. ]
  27. let curMonth = dayjs().month() + 1
  28. if (curMonth < 3) {
  29. dateTimes.push(
  30. {
  31. id: 5,
  32. name: '本季度',
  33. start_time: dayjs().month(0).format('YYYY-MM-DD'),
  34. end_time: dayjs().month(2).endOf('month').format('YYYY-MM-DD'),
  35. },
  36. {
  37. id: 6,
  38. name: '上季度',
  39. start_time: dayjs().add(-1, 'year').month(9).format('YYYY-MM-DD'),
  40. end_time: dayjs().add(-1, 'year').month(11).endOf('month').format('YYYY-MM-DD'),
  41. },
  42. )
  43. } else if (curMonth < 6) {
  44. dateTimes.push(
  45. {
  46. id: 5,
  47. name: '本季度',
  48. start_time: dayjs().month(3).format('YYYY-MM-DD'),
  49. end_time: dayjs().month(5).endOf('month').format('YYYY-MM-DD'),
  50. },
  51. {
  52. id: 6,
  53. name: '上季度',
  54. start_time: dayjs().month(0).format('YYYY-MM-DD'),
  55. end_time: dayjs().month(2).endOf('month').format('YYYY-MM-DD') ,
  56. },
  57. )
  58. } else if (curMonth < 9) {
  59. dateTimes.push(
  60. {
  61. id: 5,
  62. name: '本季度',
  63. start_time: dayjs().month(6).format('YYYY-MM-DD'),
  64. end_time: dayjs().month(8).endOf('month').format('YYYY-MM-DD'),
  65. },
  66. {
  67. id: 6,
  68. name: '上季度',
  69. start_time: dayjs().month(3).format('YYYY-MM-DD'),
  70. end_time: dayjs().month(5).endOf('month').format('YYYY-MM-DD'),
  71. },
  72. )
  73. } else if (curMonth < 12) {
  74. dateTimes.push(
  75. {
  76. id: 5,
  77. name: '本季度',
  78. start_time: dayjs().month(9).format('YYYY-MM-DD'),
  79. end_time: dayjs().month(11).endOf('month').format('YYYY-MM-DD'),
  80. },
  81. {
  82. id: 6,
  83. name: '上季度',
  84. start_time: dayjs().month(6).format('YYYY-MM-DD'),
  85. end_time: dayjs().month(8).endOf('month').format('YYYY-MM-DD'),
  86. },
  87. )
  88. }

day.js 获取年月日

  1. dayjs().year()
  2. dayjs().month()
  3. dayjs().date()
  4. 星期 dayjs().day()
  5. dayjs().hour()
  6. dayjs().minute()
  7. dayjs().second()
  8. 毫秒 dayjs().millisecond()

欢迎加群讨论技术,1群:677373950(满了,可以加,但通过不了),2群:656732739。有需要软件开发,或者学习软件技术的朋友可以和我联系~(Q:815170684)

评价

css弹性盒子flex布局

css弹性盒子由于版本不同浏览器问题造成了一些不同的写法display:flexbox;在google浏览器中如果使用下面的写法就不行displa...

可输入下拉文本框据输入动态加载数据 jquery-editable-select

用到一个jquery-editable-select的控件github地址:https://github.com/indrimuska/jquery-editable-select这个插件的原理是...

.net mvc分部页.net core分部页

.net分部页的三种方式第一种:@Html.Partial(&quot;_分部页&quot;)第二种:@{ Html.RenderPartial(&quot;分部页&quot;);}...

css中单位pxemrem和vh/vw的理解

&gt;px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。em是相对长度单位。相对于当前对象内文本的字...

让IIS支持webp格式图片让IIS支持vtt格式iis设置mime类型iis配置支持的类型

webp格式图片可以让图片体积变小。也让下载图片变得更加困难一点 在线制作webp工具 https://www.upyun.com/webp?utm_mediu...

网页上传文件断点续传的实现无视文件大小上传以及datatables基本用法

首先明白js是客户带执行代码,c#是服务器上执行代码。本地文件需要用到js处理,服务器端接受c#代码处理1.HTML页面,文件信...

如何使用图标像使用文字一样使用文本图标的方法

1.首先在Iconfont-阿里巴巴矢量图标库上面找到你需要的图标然后加入你的购物车然后选择图标;注意:每个类型的图标会大小不...

使用七牛云的cdn服务提高图片的加载速度

CDN介绍CDN的全称是Content Delivery Network,即内容分发网络。CDN加速主要是加速静态资源,如网站上面上传的图片、媒体,...

通俗易懂什么是.NET?什么是.NET Framework?什么是.NET Core?

朋友圈@蓝羽 看到一篇文章写的太详细太通俗了,搬过来细细看完,保证你对.NET有个新的认识理解原文地址:https://www.cnblo...

JS监听inputkeydown有输入法时打字完成后触发事件

在给输入框绑定input或keydown事件时预期效果是有输入法时,输入中文后触发事件,不希望输一个字母就触发一次事件可以用到c...

修改了css后让浏览器从缓存中更新

当我们修改了css后,如果不做一些操作,浏览器是不会自动更新我们的样式文件的。除非是过期或者用户手动刷新清理缓存等。所...

C MVC RedirectToAction跳转时候传递参数Action之间传值

MVC Action之间传值,页面跳转传值方法一:路由传值很简单直接使用 RedirectToAction(string actionName, string controller...

当你工作遇到以下几种状态时请果断跳槽走人

已经有想跳槽的念头,但是一直磨磨蹭蹭、犹犹豫豫的混日子,这种念头或者一直持续,或者是不是冒出头来占据你的思维了。于...
如果有缘,错过了还会重来,如果无缘,相遇了也会离开
排名
9
文章
115
粉丝
5
评论
5
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2025TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
公网安备:50010702506256
欢迎加群交流技术