更新记录

0.0.5(2021-07-08)

  • 调整 默认时间不再是当前时间,而是显示'-'字符

0.0.4(2021-05-12)

  • 新增 组件示例地址
查看更多

平台兼容性

Vue2 Vue3
App 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序 快应用
app-vue app-nvue
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

DateFormat 日期格式化

组件名:uni-dateformat 代码块: uDateformat

日期格式化组件。

安装方式

本组件符合easycom规范,HBuilderX 2.5.5起,只需将本组件导入项目,在页面template中即可直接使用,无需在页面中import和注册components

如需通过npm方式使用uni-ui组件,另见文档:https://ext.dcloud.net.cn/plugin?id=55

基本用法

template 中使用组件

<!-- 一般用法 -->
<uni-dateformat date="2020/10/20 20:20:20"></uni-dateformat>

<!-- 不显示刚刚/马上/xx分钟前 -->
<uni-dateformat date="2020/10/20 20:20:20" :threshold="[0,0]"></uni-dateformat>

API

Dateformat Props

属性名 类型 默认值 说明
date Object|String|Number Date.now() 要格式化的日期对象/日期字符串/时间戳
threshold Array [0, 0] 转化类型阈值
format String 'yyyy/MM/dd hh:mm:ss' 格式字符串
locale String zh 格式化使用的语言,目前支持zh(中文)、en(英文)

Threshold Options

格式化组件会对时间进行用户友好转化,threshold就是用来控制转化的时间阈值的。

[60000, 3600000]为例,将传入时间与当前时间差的绝对值记为delta(单位毫秒)

  • delta < 60000时,时间会被转化为“刚刚|马上”
  • delta >= 60000 && delta < 3600000时,时间会被转化为“xx分钟前|xx分钟后”,如果超过1小时会显示成“xx小时前|xx小时后”,以此类推
  • delta >= 3600000时,会按照format参数传入的格式进行格式化

如果不想转化为“马上|刚刚”可以传入:threshold = "[0,3600000]"。默认值[0,0]既不会转换为“马上|刚刚”也不会转化为“xx分钟前|xx分钟后”

Format Options

format接收字符以及含义如下:

字符 说明
yyyy 四位年份
yy 两位年份
MM 两位月份(不足两位在前面补0)
M 月份,不自动补0
dd 两位天(不足两位在前面补0)
d 天,不自动补0
hh 两位小时(不足两位在前面补0)
h 小时,不自动补0
mm 两位分钟(不足两位在前面补0)
m 分钟,不自动补0
ss 两位秒(不足两位在前面补0)
s 秒,不自动补0
SSS 三位毫秒(不足三位在前面补0)
S 毫秒,不自动补0

组件示例

点击查看:https://hellouniapp.dcloud.net.cn/pages/extUI/dateformat/dateformat

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问