当前位置: 首页 > news >正文

使用 uni-app 开发项目,日期和时间如何格式化?

功能需求描述

在开发项目时,往往需要对从后端查询到的时间进行格式化,查到的时间格式一般都是时间戳,一堆数字,这时候怎么转化成类似于 2023年8月15日 08:12:10 这样的格式?

在组件显示格式化后的日期

其实 uni-app 的官方拓展组件 uni-dateformat 就能实现这个需求,具体用法是:

<!-- 显示为中文时间格式 -->
<uni-dateformat :date="timestamp"></uni-dateformat>

date 属性可以接受时间戳、js 时间对象或者是时间字符串,非常灵活。而 format 属性则可以设置时间显示格式。

另外如果时间和现在很接近,默认会显示为“刚刚”、“5分钟前”等文字,这是比较友好的时间显示方式,如果只希望显示为时间,可以通过 threshold 属性:

<!-- 不显示刚刚/马上/xx分钟前,以及自定义年月日 -->
<uni-dateformat :date="timestamp" :threshold="[0,0]" format="yyyy年MM月dd日 hh:mm:ss"></uni-dateformat>

上面的代码例子是在 <template> 中使用组件的方式来格式化时间,这个组件很强大,还有很多种用法,可以去阅读官方组件文档。

在 js 中格式化时间日期

有时候我们需要在 js 中来格式化时间,其实也是可以的,这个用法在官方组件文档里没有说明,是我看了组件的源码发现的,就是在 js 引入 uni-dateformat 组件下的 data-format.js,这个模块导出了一个用来格式化时间的方法,详细的用法可以看这篇《uni-app 日期和时间格式化》。

相关文章:

  • HTTPS的加密方式超详细解读
  • 数据结构-邻接表广度优先搜索(C语言版)
  • 机器学习中的关键组件
  • OpenCV官方教程中文版 —— 图像修复
  • 利用MySQL玩转数据分析之基础篇
  • Proteus仿真--12864LCD显示计算器键盘按键实验(仿真文件+程序)
  • 学习小结,学而时习之,坚持学习之,温顾学习之
  • Webpack的Tree Shaking。它的作用是什么?
  • Docker Stack部署应用详解+Tomcat项目部署详细实战
  • Linux ----------------------- 文本处理工具
  • C语言 || volatile
  • 云安全-云原生k8s攻击点(8080,6443,10250未授权攻击点)
  • 【SpringBoot笔记42】SpringBoot集成knife4j生成接口文档
  • 【3D图像分割】基于Pytorch的VNet 3D图像分割5(改写数据流篇)
  • 【RabbitMQ】RabbitMQ 消息的堆积问题 —— 使用惰性队列解决消息的堆积问题
  • List 接口常用实现类底层分析
  • 『CV学习笔记』图像超分辨率等图像处理任务中的评价指标PSNR(峰值信噪比)
  • Modbus java代码实例
  • 小程序如何设置用户同意服务协议并上传头像和昵称
  • Ubuntu 增加服务 比如openfire
  • 管教打骂9岁儿子致其死亡,青岛一男子被刑拘
  • 当文徵明“相遇”莫奈:苏博将展“从拙政园到莫奈花园”
  • 国家发改委:不断完善稳就业稳经济的政策工具箱,确保必要时能够及时出台实施
  • 一个留美学生的思想转向——裘毓麐的《游美闻见录》及其他
  • 尹锡悦宣布退出国民力量党
  • 竞彩湃|欧联杯决赛前,曼联、热刺继续划水?