Documentation

Module: riot-calendar

基于riot的日历，默认日历视图由defaultDate|selectDates|new Date()按顺序提供，实例

Methods

<inner> riot-calendar(opts)

Parameters:
Name Type Description
opts object
Properties
Name Type Argument Default Description
autoOk boolean <optional>
 false 是否自动保存
defaultDate date <optional>
 默认日期
minDate date <optional>
 最小日期
maxDate date <optional>
 最大日期
isRange boolean <optional>
 是否为选择范围
rangeLimit Array.<date> <optional>
 选择的范围
weekMode boolean <optional>
 false 是否固定星期 true 固定
firstDay number <optional>
 0 每周的第一天
isMultiple boolean <optional>
 是否为多选
selectDates Array.<date> <optional>
 选中的日期
switchViewByOtherMonth boolean <optional>
 false 表示点击其它月份是否切换日历视图
switchViewOverLimit boolean <optional>
 false 表示超出最小与最大日历是否能切换日历视图
showOtherMonthDates boolean <optional>
 true 是否显示其它月的日期 @since 0.0.3beta1
switchWithAnimation boolean <optional>
 true 切换时是否需要动画
animationTimingFunction string <optional>
 cubic-bezier(0.445, 0.05, 0.55, 0.95) 动画函数
animationDuration number <optional>
 0.45 动画待续时间 默认为0.45s
onChange onChangeCall <optional>
 日期被点击时的回调函数
dateTimeFormat dateTimeFormatCall <optional>
 自定义日历显示格式
disabledDate disabledDateCall <optional>
 更精细的不可选日期控制函数
beforeShowDate beforeShowDateCall <optional>
 个性自定义每日显示样式
minRangeGap number <optional>
 range时最小选择区间
maxRangeGap number <optional>
 range时最大选择区间
onRangeGapInvalid rangeGapInvalidCall <optional>
 range选择不合minRangeGap与maxRangeGap时回调函数
numberOfMonths number | Array.<number> <optional>
 设置一次显示几个月 number 一行显示的月份数 number[] 显示的行数与列数，设置opts.numberOfMonths则默认opts.showOtherMonthDates为false
Returns:
Type
calendarTag
Example
riot.mount('riot-calendar', opts)

Type Definitions

beforeShowDateClass(data当前正在渲染的riot-date对象)

beforeShowDate 个性化日期显示
Parameters:
Name Type Description
data当前正在渲染的riot-date对象 riot-date
Since:
  • 0.0.3beta1
Returns:
返回个性化后的html片段及类名，如果为string则为html
Type
date-diy

calendarTag

扩展Tag实例
Type:
  • object
Properties:
Name Type Description
prevMonth function 选择前一个月,不能传参数
nextMonth function 选择下一个月，不能传参数
getSelectDates getSelectDatesCall 返回当前选择日期对象
switchCalendarByDate switchCalendarByDateCall 跳转到指定日期
See:

date-diy

Type:
  • object | string
Properties:
Name Type Description
html string 个性化的日期html片段
className string 个性化的日期类名，多个以空格分隔

dateTimeFormatCall(y, m, d)

dateTimeFormat 函数说明
Parameters:
Name Type Description
y number 年份
m number 月份
d number 天数

disabledDateCall(date)

disabledDate 不可选日期函数说明
Parameters:
Name Type Description
date riot-date 当前正在渲染的riot-date对象
Since:
  • 0.0.2

getSelectDatesCall()

getSelectDates 函数说明
Returns:
Type
selectDateObj

onChangeCall(date, tag)

onChange 函数说明
Parameters:
Name Type Description
date riot-date 当前被点击riot-date对象
tag calendarTag 当前riot-calendar实例对象

rangeGapInvalidCall(invalidType)

onRangeGapInvalid range时选择区间不合minRangeGap与maxRangeGap时回调函数，如果无参数，则默认将rangeEnd变为rangeStart
Parameters:
Name Type Description
invalidType string 非法类型 'min'或'max'
Since:
  • 0.0.3beta1
Returns:
是否继续执行将rangeEnd替换成rangeStart
Type
boolean

riot-date

Type:
  • object
Properties:
Name Type Argument Description
current number 表示月份 -1:前一个月 0:当前月 1:后一个月
date date 当前日期对象
y number 年份
m number 月份
d number 日
w number 星期
dateformat string 日期字符串，可以被opts.dateTimeFormat控制，默认为yyyy-mm-dd
range number <optional>
 表示范围选择,只有当opts.isRange为true时有效 -1:表示范围开始 0:表示范围中 1:表示范围结束
select number <optional>
 表示是否被选中 1:表示选中
disable number 表示当前日期是否可用 0:表示可用 1:表示其它月 2:表示超出range范围 3:表示超出min-max范围

selectDateObj

Type:
  • object
Properties:
Name Type Description
dates Array.<date> 被选中排序后的Date数组或空数组
dateStr Array.<string> 被选中排序后并经过opts.dateTimeFormat格式化后的日期字符串或空数组

switchCalendarByDateCall(需要跳转的日期)

switchCalendarByDate 函数说明
Parameters:
Name Type Description
需要跳转的日期 date
Since:
  • 0.0.3beta1
Returns:
跳转是否成功，日期如果超出受限范围[rangeLimit/minDate/maxDate]且switchViewOverLimit=true，则跳转不成功，返回false， 如果跳转日期就是当前日历视图也不会跳转，返回false
Type
boolean