全部产品
云市场

日历(Calendar)

更新时间:2019-09-09 15:17:38

本文介绍日历(Calendar)。

属性名 描述 类型 默认值 必选
type 选择类型 single: 单日 range: 日期区间 String single false
tagData 标记数据,其中包括日期 date、标记 tag、是否禁用 disable、标记颜色 tagColortagColor 有 5 个可选值:#f5a911、#e8541e、#07a89b、#108ee9、#b5b5b5. Array<date, tag, tagColor> - false
onSelect 选择区间回调 ([startDate, endDate]) => void - false
onMonthChange 点击切换月份时回调,带两个参数 currentMonth 切换后月份和 prevMonth 切换前月份 (currentMonth, prevMonth) => void - false
onSelectHasDisableDate 选择区间包含不可用日期 (currentMonth, prevMonth) => void - false

代码示例

  1. {
  2. "defaultTitle": "小程序AntUI组件库",
  3. "usingComponents":{
  4. "calendar": "mini-antui/es/calendar/index"
  5. }
  6. }
  1. <view>
  2. <calendar
  3. type="single"
  4. tagData="{{tagData}}"
  5. onSelect="handleSelect" />
  6. </view>
  1. Page({
  2. data: {
  3. tagData: [
  4. { date: '2018-05-14', tag: '还房贷', tagColor: 5 },
  5. { date: '2018-05-28', tag: '公积金', tagColor: 2 },
  6. ],
  7. },
  8. handleSelect() {},
  9. onMonthChange() {},
  10. });