更新记录
1.0.0(2024-06-20)
下载此版本
时间日期选择器,功能支持多样化
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
× |
× |
√ |
√ |
× |
× |
× |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
鸿蒙元服务 |
√ |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
√ |
√ |
√ |
√ |
√ |
√ |
√ |
√ |
√ |
datetime-picker 日期时间选择器
安装方式
本组件符合easycom规范,HBuilderX 2.5.5起,只需将本组件导入项目,在页面template中即可直接使用,无需在页面中import和注册components。
使用方式
在 template 中使用组件
<template>
<view class="content">
<await-datetime-picker name="picker" type="YYYY-MM-DD HH:mmss" isEmpty @change="change"></await-datetime-picker>
</view>
</template>
<script>
export default {
methods: {
change(date, name) {
console.log(date)
console.log(name)
}
}
}
</script>
API
DatetimePicker Props
属性名 |
类型 |
可选值 |
默认值 |
说明 |
value |
String,Number |
- |
- |
datetime的默认值 |
type |
String |
YYYY-MM-DD HH:mmss / YYYY-MM-DD / HH:mmss |
YYYY-MM-DD HH:mmss |
时间类型 |
timestamp |
Boolean |
true/false |
false |
是否使用时间戳模式 |
placeholder |
String |
- |
'请选择日期时间' |
组件默认的显示信息 |
popupTitle |
String |
- |
'选择开始时间' |
组件弹窗标题 |
name |
String |
- |
- |
组件的名称,change方法的第二个参数 |
minDateTime |
String |
- |
- |
最小时间 |
maxDateTime |
String |
- |
- |
最大时间 |
backgroundColor |
String |
- |
#B20002 |
默认按钮颜色 |
isEmpty |
Boolean |
true/false |
true |
是否显示清空 |
事件说明
事件名 |
说明 |
返回值 |
change |
选择器点击确认按钮时触发 |
datetime,name |
备注说明
组件属于二开,由于原作者不再维护了,于是在原来的基础上做了优化,已供代码学习使用。