Skip to content

Commit 534c1ec

Browse files
artawoodarthurdenner
authored andcommitted
docs(readme): improve usage section (#145)
* added react hook usage to documentation for further clarity * modified examples for react hooks * separate onChange function * added semi-colon * replace empty string with null as initial state
1 parent 0bbe415 commit 534c1ec

File tree

1 file changed

+12
-8
lines changed

1 file changed

+12
-8
lines changed

README.md

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -45,17 +45,21 @@ yarn add react-semantic-ui-datepickers
4545
## Usage
4646

4747
```jsx
48-
import React from 'react';
48+
import React, { useState } from 'react';
4949
import SemanticDatepicker from 'react-semantic-ui-datepickers';
5050
import 'react-semantic-ui-datepickers/dist/react-semantic-ui-datepickers.css';
5151

52-
const AppWithBasic = ({ onChange }) => (
53-
<SemanticDatepicker onChange={onChange} />
54-
);
55-
56-
const AppWithRangeAndInPortuguese = ({ onChange }) => (
57-
<SemanticDatepicker locale="pt-BR" onChange={onChange} type="range" />
58-
);
52+
const AppWithBasic = () => {
53+
const [currentDate, setNewDate] = useState(null);
54+
const onChange = (event, data) => setNewDate(data.value);
55+
<SemanticDatepicker onChange={onChange} />;
56+
};
57+
58+
const AppWithRangeAndInPortuguese = () => {
59+
const [currentRange, setNewRange] = useState([]);
60+
const onChange = (event, data) => setNewRange(data.value);
61+
return <SemanticDatepicker locale="pt-BR" onChange={onChange} type="range" />;
62+
};
5963
```
6064

6165
More examples [here](https://react-semantic-ui-datepickers.now.sh).

0 commit comments

Comments
 (0)