uniapp 【专题详解 -- 时间】云数据库时间类型设计,时间生成、时间格式化渲染(uni-dateformat 组件的使用)

简介: uniapp 【专题详解 -- 时间】云数据库时间类型设计,时间生成、时间格式化渲染(uni-dateformat 组件的使用)

云数据表的时间类型设计

推荐使用时间戳 timestamp

"createTime": {
  "bsonType": "timestamp",
  "label": "创建时间:"
}

时间生成

获取当前时间 Date.now()

.add({
  createTime: Date.now()
})

时间格式化渲染

下载安装组件 uni-dateformat

https://ext.dcloud.net.cn/plugin?name=uni-dateformat

页面中使用

<uni-dateformat :threshold="[60000, 3600000]" :date="item.createTime"></uni-dateformat>
  • 距渲染时间1分钟内——显示 “刚刚|马上”
  • 距渲染时间1分钟~1小时—— 显示 “xx分钟前|xx分钟后”
  • 距渲染时间1小时以上 —— 显示format参数传入的格式

如仅显示年月日

<uni-dateformat format='yyyy年MM月dd日' :date="item.createTime"></uni-dateformat>

效果为

2024年01月05日

更多用法可参考官方文档

https://uniapp.dcloud.net.cn/component/uniui/uni-dateformat.html

目录
打赏
0
0
0
0
64
分享
相关文章
在线课堂+工具组件小程序uniapp移动端源码
在线课堂+工具组件小程序uniapp移动端源码
178 0
在线课堂+工具组件小程序uniapp移动端源码
低代码可视化-uniapp SliderRange区间组件-代码生成器
SliderRange区间组件是一种用户界面元素,允许用户通过拖动滑块选择数值范围。组件支持微信小程序、H5和App,具有高度可定制性、响应式设计和多种事件处理功能。适用于价格筛选、音量调节等场景。代码实现包括滑动区域、滑块、事件处理等部分,支持可视化配置步长、颜色等属性。使用时需注意选择合适步长、提供清晰标签和考虑无障碍设计。
266 0
低代码可视化开发-uniapp新闻跑马灯组件-代码生成器
低代码可视化开发-uniapp新闻跑马灯组件-代码生成器
360 2
|
10月前
|
uniapp APP自动更新组件
uniapp APP自动更新组件
318 1
|
10月前
|
uniapp uview扩展u-picker支持日历期间 年期间 月期间 时分期间组件
uniapp uview扩展u-picker支持日历期间 年期间 月期间 时分期间组件
477 10
uniapp/vue个性化单选、复选组件
uniapp/vue个性化单选、复选组件
323 5
DIY可视化UniApp表格组件
DIY可视化UniApp表格组件
178 0
uniapp纯CSS实现圆形进度条组件
uniapp纯CSS实现圆形进度条组件
412 0
|
10月前
Uniapp矩阵评分组件
Uniapp矩阵评分组件
129 2

热门文章

最新文章

AI助理
登录插画

登录以查看您的控制台资源

管理云资源
状态一览
快捷访问

你好,我是AI助理

可以解答问题、推荐解决方案等