t-text-date

TextDate 日期文本

组件介绍

t-text-date 是用于格式化显示日期时间的文本组件，支持自定义日期格式，适用于需要显示格式化日期的场景。

平台兼容

Harmony	H5	Android	iOS	小程序	UTS
✅	✅	✅	✅	✅	✅

基础用法

基础用法参考 demo/text-date/text-date.uvue。

<template>
  <view class="text-date-demo">
    <!-- 默认格式 -->
    <t-text-date text="2026-03-20 14:30:00"></t-text-date>
    
    <!-- 自定义格式 -->
    <t-text-date text="2026-03-20 14:30:00" format="yyyy-mm-dd"></t-text-date>
    
    <!-- 仅显示时间 -->
    <t-text-date text="2026-03-20 14:30:00" format="hh:MM:ss"></t-text-date>
    
    <!-- 完整格式 -->
    <t-text-date text="2026-03-20 14:30:00" format="yyyy年mm月dd日 hh时MM分ss秒"></t-text-date>
  </view>
</template>

<style scoped>
.text-date-demo {
  padding: 40rpx;
}
</style>

Props

属性名	说明	类型	默认值
text	需要格式化的日期文本	string	''
format	日期格式化格式	string	'yyyy-mm-dd hh:MM:ss'
path	点击组件后跳转的页面路径；为空时仅响应事件	string	''
hover	是否启用点击效果	boolean	true
type	组件主题类型，可选 info、primary、error、warning、success	string	''
disabled	是否禁用	boolean	false
effect	组件显示主题，可选 normal、dark、light、plain	string	''
size	组件尺寸，可选 large、medium、small、mini	string	'medium'

日期格式说明

占位符	说明	示例
yyyy	四位年份	2026
mm	两位月份	03
dd	两位日期	20
hh	两位小时（24小时制）	14
MM	两位分钟	30
ss	两位秒	00

Events

事件名	说明	回调参数
click	点击时触发	event
initFinished	组件初始化完成触发	组件节点信息
touchstart	触摸开始时触发	event
touchend	触摸结束时触发	event
touchmove	触摸移动时触发	event
touchcancel	触摸取消时触发	event