Skip to content

Commit cab7747

Browse files
committed
chore: update README.md
1 parent e7e758a commit cab7747

File tree

1 file changed

+16
-23
lines changed

1 file changed

+16
-23
lines changed

README.md

+16-23
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@ Because I can`t be comfortable using [viewerjs](https://github.com/fengyuanchen/
99

1010
## Installation
1111

12+
> react >= 16.8.0 | react-dom >= 16.8.0
13+
1214
```bash
1315
npm install react-viewer --save
1416
```
@@ -18,29 +20,20 @@ npm install react-viewer --save
1820
```javascript
1921
import * as React from 'react';
2022
import Viewer from 'react-viewer';
21-
import 'react-viewer/dist/index.css';
22-
23-
class App extends React.Component<any, any> {
24-
constructor() {
25-
super();
26-
27-
this.state = {
28-
visible: false,
29-
};
30-
}
31-
32-
render() {
33-
return (
34-
<div>
35-
<button onClick={() => { this.setState({ visible: !this.state.visible }); } }>show</button>
36-
<Viewer
37-
visible={this.state.visible}
38-
onClose={() => { this.setState({ visible: false }); } }
39-
images={[{src: '', alt: ''}]}
40-
/>
41-
</div>
42-
);
43-
}
23+
24+
function App() {
25+
const [ visible, setVisible ] = React.useState(false);
26+
27+
return (
28+
<div>
29+
<button onClick={() => { setVisible(true); } }>show</button>
30+
<Viewer
31+
visible={visible}
32+
onClose={() => { setVisible(false); } }
33+
images={[{src: '', alt: ''}]}
34+
/>
35+
</div>
36+
);
4437
}
4538
```
4639

0 commit comments

Comments
 (0)