@@ -26,40 +26,41 @@ function Demo () {
2626
2727 const [dataRange ,dataRangeSet ] = React .useState ([' 2022-02-25 15:06:24' ' 2022-02-27 14:47:32'
2828
29- function onChange (selectedDate ,dataRange ) {
29+ function onChange (selectedDate ,dataRange ) {
3030 console .log (' selectedDate'
3131 }
32- return (
33- < div>
34- < Row gutter= {10 } style= {{ maxWidth: 360 ,marginBottom: 10 }}>
35- < Col fixed>
36- < DateInput
37- value= {new Date ()}
38- datePickerProps= {{ todayButton: ' 今天'
39- onChange= {onChange}
40- / >
41- < / Col>
42- < Col>
43- < DateInput
44- value= {new Date ()}
45- disabled
46- onChange= {onChange}
47- / >
48- < / Col>
49- < / Row>
50- < Row gutter= {10 }>
51- < Col>
52- < DateInputRange
53- bodyStyle= {{width: 350 }}
54- format= " YYYY/MM/DD HH:mm:ss"
55- value= {dataRange}
56- datePickerProps= {{ todayButton: ' 今天' : true }}
57- onChange= {onChange}
58- / >
59- < / Col>
60- < / Row>
61- < / div>
62- )
32+
33+ return (
34+ < div>
35+ < Row gutter= {10 } style= {{ maxWidth: 360 ,marginBottom: 10 }}>
36+ < Col fixed>
37+ < DateInput
38+ value= {new Date ()}
39+ datePickerProps= {{ todayButton: ' 今天'
40+ onChange= {onChange}
41+ / >
42+ < / Col>
43+ < Col>
44+ < DateInput
45+ value= {new Date ()}
46+ disabled
47+ onChange= {onChange}
48+ / >
49+ < / Col>
50+ < / Row>
51+ < Row gutter= {10 }>
52+ < Col>
53+ < DateInputRange
54+ bodyStyle= {{width: 350 }}
55+ format= " YYYY/MM/DD HH:mm:ss"
56+ value= {dataRange}
57+ datePickerProps= {{ todayButton: ' 今天' : true }}
58+ onChange= {onChange}
59+ / >
60+ < / Col>
61+ < / Row>
62+ < / div>
63+ )
6364}
6465ReactDOM .render (< Demo / > , _mount_);
6566```
@@ -196,6 +197,34 @@ class Demo extends React.Component {
196197ReactDOM .render (< Demo / > , _mount_);
197198```
198199
200+ ## 自动隐藏弹层
201+
202+ <!-- rehype:bgWhite=true&codeSandbox=true&codePen=true-->
203+ ``` jsx
204+ import React from ' react'
205+ import ReactDOM from ' react-dom'
206+ import { DateInput } from ' uiw'
207+
208+ class Demo extends React .Component {
209+ onChange (selectedDate ) {
210+ console .log (' selectedDate:'
211+ }
212+ render () {
213+ return (
214+ < div style= {{ maxWidth: 200 }}>
215+ < DateInput
216+ autoClose= {true }
217+ format= " YYYY/MM/DD HH:mm:ss"
218+ datePickerProps= {{ showTime: true , todayButton: ' 今天'
219+ onChange= {this .onChange .bind (this )}
220+ / >
221+ < / div>
222+ )
223+ }
224+ }
225+ ReactDOM .render (< Demo / > , _mount_);
226+ ```
227+
199228## Props
200229
201230| 参数 | 说明 | 类型 | 默认值 |
@@ -208,6 +237,7 @@ ReactDOM.render(<Demo />, _mount_);
208237| popoverProps | 将参数传递给 [ ` <Popover> ` ] ( #/components/popover ) 组件 | Object | - |
209238| datePickerProps | 将参数传递给 [ ` <DatePicker> ` ] ( #/components/date-picker ) 组件 | Object | - |
210239| disabled | 组件 [ ` <Input> ` ] ( #/components/input ) 的属性，禁用日历 | Boolean | - |
240+ | autoClose | 是否自动关闭弹层 | Boolean | false |
211241
212242组件 ` DateInput ` 继承 ` <Input> ` 组件，更多属性文档请参考 [ ` <Input> ` ] ( #/components/input ) 。
213243
0 commit comments