react-waterfall-calendar

Props

    <Calendar
      interval
      selectType
      classNames
      dataAttribute
      defaultSelected
      dateFormat
      monthFormat
      enableTouchTap
      onClick
    ></Calendar>

interval

日历显示的月份区间

    const { from, to, months } = interval;

{ from, to }

格式为符合 ISO 8601 的 String 类型

{ months }

格式为大于0的 Number 类型，{ from } 为 undefined 时从当前月份开始计算

⚠️ 当months !== undefined时，to将不起任何作用

selectType

日期选择类型

格式为 String 类型，接受以下三个值，默认为 'SINGLE'

‘INTERVAL’

被选中的日期是前后选择的两次日期间的所有日期

‘MULTIPLE’

所有被选中的日期都会同时存在

‘SINGLE’

只有最后一个被选择的日期

classNames

传入自定义样式的样式名

    const { calendar, month, horizontal, date } = classNames;

dataAttribute

可对个别日期单独设置 data-* 属性

    const dataAttribute = {};
    dataAttribute['2017-04-05'] = { attribute: 'attribute' }

defaultSelected

默认选中的日期

    const defaultSelected = ['2017-02-06', '2017-02-07'];

dateFormat

日期显示格式

默认为 'D'

    const dateFormat = 'D' || 'DD' || 'D日';

monthFormat

月份标题格式

默认为 'YYYY-MM'

    const dateFormat = 'M' || 'MM' || 'M月';

onClick

点击日期时触发的回调方法

    function onClick({ date, event, nextSelected, state }) {}

调用 onClick 后的返回值

false [boolean]

被选中的日期不会更新为 nextSelected 中的内容

{ nextSelected } [Array]

会根据 onClick 返回的 nextSelected 值更新
nextSelected 为 符合 ISO 8601 的 String 类型 的数组

enableTouchTap

当 enableTouchTap = true 时，onClick回调事件为 onTouchTap

默认为 false