@beisen/DateTime

DateTime 使用说明

项目运行

1. cnpm install 或 npm install cnpm使用教程

2. npm run dev （开发环境打包 port:8080）

3. npm run test （测试用例）

4. npm run build （生产环境打包）

DateTime参数

  state = {
    TimeData : {
      "title":"测测试测试试试试"   //时间控件前的label
      ,"value":"2016-12-12 12:12:12"
                                 /*input框里的值，主要用于重置时间，非必须定义
                                  优先级比defaultValue高
                                  */
      ,"defaultValue":""
                                  /**初始默认时间(string) 
                                    注意：
                                    1.默认日期的格式需与format格式相同!!!! 
                                    2.日期格式可以是 "yyyy-MM-dd" 或者 "yyyy/MM/dd"，并符合第一条注意点
                                    3.如果是单日历，则类型为字符串，如果是范围日历，则类型为数组：
                                  
                                    单日历： 有初始值："2016-12-12 12:12:12" 或 "2016-12-12" ， 无初始值：""
                                    月日历： 有初始值："2015-12"   无初始值: null 
                                    范围日历： 有初始值：["2016-1-1 11:11:11","2016-12-12 12:12:12"] ，无初始值：[]
                                  **/
      ,"showTime":true            //增加时间选择功能
      ,"dateStyle":"MonthPicker" /**日期展示的格式 DatePicker(单个日历)  RangePicker(范围日历) MonthPicker(月日历) (string)**/               
      ,"format":"yyyy-MM-dd HH:mm:ss"     /**展示的时间格式 "yyyy-MM-dd" "yyyy-MM-dd HH:mm:ss" "yyyy-MM"  "yyyy-MM"(月日历) (string)**/         
      ,"placeholder":"请选择日期"    /**没有值时的提示,仅对单日历生效 (string)**/          
      ,"startPlaceholder": "开始时间"/**没有值时的提示，开始日期提示,仅对范围日历生效 (string)**/
      ,"endPlaceholder": "截止时间"   /**没有值时的提示，结束日期提示,仅对范围日历生效 (string)**/
      ,"disabled":false           /**禁用全部操作 (bool)**/ 
      ,"readonly":false    //只读，无法点击  
      ,"required":true      /**是否必填**/
      ,"disabledDate":"empty"               
                                  /**指定不可选择日期 (string)
                                    注意：仅对单日历有效！！
                                    "all" 所有日期都不可选
                                    "beforeToday" 不可选择今天之前的日期(包括今天)
                                    "afterToday" 不可选择今天之后的日期
                                    "empty" 所有日期都可选
                                    "lasttwoweeks" 过去两周可选
                                  **/
      ,"style":{                  //自定义输入框样式
        "width":"50%"
        ,"height":""
      }
      ,"hidden":false  //是否显示
      ,"showStatus":"是否报错"  //显示状态 "search" or ""
      ,"errorStatus":true //是否报错
      ,"errorMsg":"出错了~~~！" //报错信息
      ,"onChange":function(value,booldata){console.log(value,booldata)} /**点击后时间回调**/
    }
  }

DateTime调用方法

1. 引用组件

import DateTime from "./src/index"

2. 传入参数

该参数为上述参数，传入方式使用: data={参数}

test(){
  //点击重置按钮后将value变为空
  this.setState({value:""})
}
render () {
    return (
      <div>
        <button onClick={::this.test}></button>
        <DateTime {...this.state} />
      </div>
    )
  }