移动开发平台 mPaaS 选择日期

By | 2021年4月23日
0 Comment

my.datePicker

说明：mPaaS 10.1.32 及以上版本支持该接口。

该接口用于打开日期选择列表。

入参

名称 类型 必填 描述
format String 否 返回的日期格式，
1. yyyy-MM-dd（默认）
2. HH:mm
3. yyyy-MM-dd HH:mm
4. yyyy-MM （最低基础库：1.1.1， 可用 canIUse(‘datePicker.object.format.yyyy-MM’) 判断）
5. yyyy （最低基础库：1.1.1，可用 canIUse(‘datePicker.object.format.yyyy’) 判断）
currentDate String 否 初始选择的日期时间，默认为当前时间。
startDate String 否 最小日期时间。
endDate String 否 最大日期时间。
success Function 否 调用成功的回调函数。
fail Function 否 调用失败的回调函数。
complete Function 否 调用结束的回调函数（调用成功、失败都会执行）。

success 返回值

名称 类型 描述
date String 选择的日期。

错误码

error 描述 解决方案
11 用户取消操作。 这是用户正常交互流程分支，不需要特殊处理。

代码示例

  
    
   
  1. // API-DEMO page/API/date-picker/date-picker.json
    2. 
   
  2. {
    3. 
   
  3.  "defaultTitle": "Date Picker"
    4. 
   
  4. }
    5. 
  
  
    
   
  1. <!-- API-DEMO page/API/date-picker/date-picker.axml -->
    2. 
   
  2. <view class="page">
    3. 
   
  3.  <view class="page-description">选择日期 API</view>
    4. 
   
  4.  <view class="page-section">
    5. 
   
  5.  <view class="page-section-title">my.datePicker</view>
    6. 
   
  6.  <view class="page-section-demo">
    7. 
   
  7.  <button class="page-body-button" type="primary" onTap="datePicker">选择日期-1</button>
    8. 
   
  8.  <button class="page-body-button" type="primary" onTap="datePickerHMS">选择日期-2</button>
    9. 
   
  9.  <button class="page-body-button" type="primary" onTap="datePickerYMDHMS">选择日期-3</button>
    10. 
   
  10.  </view>
    11. 
   
  11.  </view>
    12. 
   
  12. </view>
    13. 
  
  
    
   
  1. // API-DEMO page/API/date-picker/date-picker.js
    2. 
   
  2. Page({
    3. 
   
  3.  datePicker() {
    4. 
   
  4.  my.datePicker({
    5. 
   
  5.  currentDate: '2016-10-10',
    6. 
   
  6.  startDate: '2016-10-9',
    7. 
   
  7.  endDate: '2017-10-9',
    8. 
   
  8.  success: (res) => {
    9. 
   
  9.  my.alert({
    10. 
   
  10.  title: 'datePicker response: ' + JSON.stringify(res)
    11. 
   
  11.  });
    12. 
   
  12.  },
    13. 
   
  13.  });
    14. 
   
  14.  },
    15. 
   
  15.  datePickerHMS() {
    16. 
   
  16.  my.datePicker({
    17. 
   
  17.  format: 'HH:mm',
    18. 
   
  18.  currentDate: '12:12',
    19. 
   
  19.  startDate: '11:11',
    20. 
   
  20.  endDate: '13:13',
    21. 
   
  21.  success: (res) => {
    22. 
   
  22.  my.alert({
    23. 
   
  23.  title: 'datePicker response: ' + JSON.stringify(res)
    24. 
   
  24.  });
    25. 
   
  25.  },
    26. 
   
  26.  });
    27. 
   
  27.  },
    28. 
   
  28.  datePickerYMDHMS() {
    29. 
   
  29.  my.datePicker({
    30. 
   
  30.  format: 'yyyy-MM-dd HH:mm',
    31. 
   
  31.  currentDate: '2012-01-09 11:11',
    32. 
   
  32.  startDate: '2012-01-01 11:11',
    33. 
   
  33.  endDate: '2012-01-10 11:11',
    34. 
   
  34.  success: (res) => {
    35. 
   
  35.  my.alert({
    36. 
   
  36.  title: 'datePicker response: ' + JSON.stringify(res)
    37. 
   
  37.  });
    38. 
   
  38.  },
    39. 
   
  39.  });
    40. 
   
  40.  },
    41. 
   
  41. });
    42. 
  
  
    
   
  1. /* API-DEMO page/API/date-picker/date-picker.acss */
    2. 
   
  2. button + button {
    3. 
   
  3.  margin-top: 20rpx;
    4. 
   
  4. }
    5.

请关注公众号获取更多资料

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注