@beisen/m-m-calendar

0.0.1-alpha.8 • Public • Published

等待替换后废弃,请勿使用,不做任何支持。

@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 git@gitlab.beisencorp.com:ux-cnpm/ux-m-calendar.git

npm install

npm run start

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

Package Sidebar

Install

npm i @beisen/m-m-calendar

Weekly Downloads

1

Version

0.0.1-alpha.8

License

MIT

Unpacked Size

3.84 MB

Total Files

145

Last publish

Collaborators

  • albert-zhang
  • liugenpeng
  • beisencorp
  • lgm
  • neozw