Narcissistic Preening Monarch

    @beisen/DateTime

    0.2.22 • Public • Published

    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"
    
    1. 传入参数

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

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

    Install

    npm i @beisen/DateTime

    DownloadsWeekly Downloads

    3

    Version

    0.2.22

    License

    ISC

    Last publish

    Collaborators

    • beisencorp