TimePicker 使用说明
项目运行
-
cnpm install 或 npm install cnpm使用教程
-
npm run dev (开发环境打包 port:8080)
-
npm run test (测试用例)
-
npm run build (生产环境打包)
TimePicker参数
state = {
"title":"测试时测试按错撒"
,"value":"11:11:11" //时间的值
,"defaultValue":"" /**初始默认时间(string)
1.默认日期的格式需与format格式相同!!!!
**/
,"placeholder":"测试" /**没有值的时候显示的内容(string)**/
,"format":"HH:mm:ss" /**展示的时间格式 "HH:mm:ss"、"HH:mm"、"mm:ss" (string)**/
,"disabled":false /**禁用全部操作 (bool)**/
,"hidden":false /**是否隐藏**/
,"readonly":false /**是否只读**/
,"required":true /**是否必填**/
,"disabledHours":{
"value":[22,3]
,"limit":"open"
}
/**限制选择部分 小时选项(array)
[开始时间(小时),结束时间(小时)]
limit: open 启用限制
close 关闭限制
范围:0~24
结束时间可小于开始时间
**/
,"disabledMinutes":{
"value":[40,10]
,"limit":"open"
} /**限制选择部分 分钟选项(array)
value:[开始分钟,结束分钟]
limit: open 启用限制
close 关闭限制
范围:0~60
结束时间可小于开始时间
**/
,"disabledSeconds":{ /**限制选择部分 秒选项(array) ,配置规范同分钟**/
"value":[0,30]
,"limit":"open"
}
,"hideDisabledOptions":false /**隐藏禁止选择的选项 (bool)**/
,"showStatus":"是否报错" //显示状态 "search" or ""
,"errorStatus":false //是否报错
,"errorMsg":"出错了~~~!" //报错信息
,"onChange":function(time,booldata){console.log(time,booldata)} /**点击后时间回调**/
}
TimePicker调用方法
- 引用组件
import TimePicker from "./src/index"
- 传入参数
该参数为上述参数,传入方式使用:
render () {
return (
<TimePicker {...this.state} />
)
}