diff options
Diffstat (limited to 'examples/value-and-defaultValue.js')
-rw-r--r-- | examples/value-and-defaultValue.js | 46 |
1 files changed, 46 insertions, 0 deletions
diff --git a/examples/value-and-defaultValue.js b/examples/value-and-defaultValue.js new file mode 100644 index 0000000..67771c0 --- /dev/null +++ b/examples/value-and-defaultValue.js | |||
@@ -0,0 +1,46 @@ | |||
1 | /* eslint no-console:0 */ | ||
2 | |||
3 | import 'rc-time-picker/assets/index.less'; | ||
4 | |||
5 | import React from 'react'; | ||
6 | import ReactDom from 'react-dom'; | ||
7 | |||
8 | import GregorianCalendar from 'gregorian-calendar'; | ||
9 | import DateTimeFormat from 'gregorian-calendar-format'; | ||
10 | import zhCn from 'gregorian-calendar/lib/locale/zh_CN'; | ||
11 | |||
12 | import TimePicker from 'rc-time-picker'; | ||
13 | import TimePickerLocale from 'rc-time-picker/src/locale/zh_CN'; | ||
14 | |||
15 | const formatter = new DateTimeFormat('HH:mm:ss'); | ||
16 | |||
17 | const now = new GregorianCalendar(zhCn); | ||
18 | now.setTime(Date.now()); | ||
19 | |||
20 | const App = React.createClass({ | ||
21 | getInitialState() { | ||
22 | return { | ||
23 | value: now, | ||
24 | }; | ||
25 | }, | ||
26 | handleValueChange(value) { | ||
27 | console.log(value && formatter.format(value)); | ||
28 | this.setState({ value }); | ||
29 | }, | ||
30 | render() { | ||
31 | return ( | ||
32 | <div> | ||
33 | <TimePicker formatter={formatter} locale={TimePickerLocale} | ||
34 | defaultValue={now} /> | ||
35 | <TimePicker formatter={formatter} locale={TimePickerLocale} | ||
36 | value={this.state.value} | ||
37 | onChange={this.handleValueChange}/> | ||
38 | </div> | ||
39 | ); | ||
40 | } | ||
41 | }); | ||
42 | |||
43 | ReactDom.render( | ||
44 | <App />, | ||
45 | document.getElementById('__react-content') | ||
46 | ); | ||