@beisen/m-calendar

参数

1. 参数events

events传入的必须是一个数组，数组的每个元素的格式 如下

{
  title: "时间1"   //事件名称
  ,start: new Date()  //事件开始时间
  ,end: new Date() //事件结束时间
}

2. 参数attribute

attribute传入的必须是一个数组，数组的每个元素的格式 如下

{
  title: "时间1"
  ,time: new Date()  //绑定事件的属性
  ,color: {
    titleColor: "#dddddd" ／／
    ,dateColor: "#333"  //日期数字颜色
    ,eventColor: "#333"  //事件颜色
  }
}

3. 参数onSelectEvent

点击某一天时，调用这个方法,方法的参数如下：

/*
date  //点击的日期
event //点击当天要进行的事件
attribute  //当天的属性
*/
（date,event，attribute)=>{   // 日期选择事件
  	
 }

<Calendar {...this.props} events={events} date={ this.state.date } defaultDate={ this.state.date } onSelectEvent={(date,event,attribute)=>{ // 日期选择事件 this.setState({date:date}) }} onSwipeLeft = { this.onChange.bind(this,1) } onSwipeRight = { this.onChange.bind(this, -1) } components={{ header : WeekHeader //自定义日历头部 ,dateCell : DateCell //自定义每个日历单元格 }} />

## 使用

import Calendar from '@beisen/m-calendar'; require('@beisen/m-calendar/lib/css/m-calendar.css');

<Calendar events={events} date={ this.state.date } defaultDate={ this.state.date } onSelectEvent={(date,event)=>{ // 日期选择事件 this.setState({date:date}) }} onSwipeLeft = { this.onChange.bind(this,1) } onSwipeRight = { this.onChange.bind(this, -1) } components={{ header : WeekHeader //自定义日历头部 ,dateCell : DateCell //自定义每个日历单元格 }} />

## 运行

git clone [email protected]:ux-cnpm/ux-m-calendar.git

npm install

npm run start

//访问 http://localhost:8080/app/