• 下载
  • 社区

my.datePicker

打开日期选择列表。


扫码体验

选择日期.jpeg


效果示例


选择日期.gif


示例代码

// API-DEMO page/API/date-picker/date-picker.json
{
    "defaultTitle": "Date Picker"
}


<!-- API-DEMO page/API/date-picker/date-picker.axml -->
<view class="page">
  <view class="page-description">选择日期 API</view>
  <view class="page-section">
    <view class="page-section-title">my.datePicker</view>
    <view class="page-section-demo">
      <button class="page-body-button" type="primary" onTap="datePicker">选择日期-1</button>
      <button class="page-body-button" type="primary" onTap="datePickerHMS">选择日期-2</button>
      <button class="page-body-button" type="primary" onTap="datePickerYMDHMS">选择日期-3</button>
    </view>
  </view>
</view>


// API-DEMO page/API/date-picker/date-picker.js
Page({
  datePicker() {
    my.datePicker({
      currentDate: '2016-10-10',
      startDate: '2016-10-9',
      endDate: '2017-10-9',
      success: (res) => {
        my.alert({
          title: 'datePicker response: ' + JSON.stringify(res)
        });
      },
    });
  },
  datePickerHMS() {
    my.datePicker({
      format: 'HH:mm',
      currentDate: '12:12',
      startDate: '11:11',
      endDate: '13:13',
      success: (res) => {
        my.alert({
          title: 'datePicker response: ' + JSON.stringify(res)
        });
      },
    });
  },
  datePickerYMDHMS() {
    my.datePicker({
      format: 'yyyy-MM-dd HH:mm',
      currentDate: '2012-01-09 11:11',
      startDate: '2012-01-01 11:11',
      endDate: '2012-01-10 11:11',
      success: (res) => {
        my.alert({
          title: 'datePicker response: ' + JSON.stringify(res)
        });
      },
    });
  },
});


/* API-DEMO page/API/date-picker/date-picker.acss */
button + button {
  margin-top: 20rpx;
}


入参

Object 类型,属性如下:

属性

类型

必填

描述

format

String

返回的日期格式。

currentDate

String

初始选择的日期时间,默认当前时间。

startDate

String

最小日期时间。

endDate

String

最大日期时间。

success

Function

调用成功的回调函数。

fail

Function

调用失败的回调函数。

complete

Function

调用结束的回调函数(调用成功、失败都会执行)。

返回的日期格式有:

  • yyyy-MM-dd(默认)
  • HH:mm
  • yyyy-MM-dd HH:mm
  • yyyy-MM(最低基础库:1.1.1,可用 canIUse('datePicker.object.format.yyyy-MM') 判断)
  • yyyy(最低基础库:1.1.1,可用 canIUse('datePicker.object.format.yyyy') 判断)


success 回调函数

入参为 Object 类型,属性如下:

属性

类型

描述

date

String

选择的日期


结果码

结果码

描述

11

用户取消操作