Skip to content

Commit b498747

Browse files
committed
Update readme.md file
1 parent d39ebab commit b498747

File tree

1 file changed

+39
-34
lines changed

1 file changed

+39
-34
lines changed

readme.md

Lines changed: 39 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,54 +1,59 @@
1-
# react-hook-outside
1+
2+
# react-hooks-outside
3+
24
Call react hooks from outside of the components
3-
## Installation
5+
6+
## Installation
7+
48
Using npm:
59

6-
npm install --save react-hook-outside
7-
Import module
10+
npm install --save react-hooks-outside
811

9-
// using ES6 modules
10-
import { ReactHooksWrapper, setHook, getHook } from "react-hook-outside";
11-
## API
12+
Import module
1213

14+
// using ES6 modules
15+
import { ReactHooksWrapper, setHook, getHook } from "react-hooks-outside";
16+
## API
1317
- setHook( name, hook )
1418
- getHook( name )
15-
## Demo
16-
https://codesandbox.io/s/demo-react-hooks-outside-k8vh9
1719

18-
## Example
20+
## Demo
21+
https://codesandbox.io/s/demo-react-hooks-outside-k8vh9
1922

23+
24+
## Example
2025
Add \<ReactHooksWrapper /> component to App.js file and declare some hooks
2126

2227
```javascript
23-
import { ReactHooksWrapper, setHook } from 'react-hook-outside';
24-
import React from 'react';
25-
//
26-
import { useHistory } from "react-router-dom";
27-
import { useSnackbar } from "notistack";
28-
28+
import { ReactHooksWrapper, setHook } from 'react-hooks-outside';
29+
import React from 'react';
30+
//
31+
import { useHistory } from "react-router-dom";
32+
import { useSnackbar } from "notistack";
33+
2934
setHook("history", useHistory)
30-
.setHook("snackbar", useSnackbar)
31-
// .setHook("hook1", useHook1)
32-
// .setHook("hookWithArguments", useHookWithArguments.bind(null, arg1, arg2))
33-
// .setHook("hook3", useHook3);
34-
35-
const App = ()=> {
36-
return (
37-
<div>
38-
...
39-
<ReactHooksWrapper />
40-
</div>
41-
);
35+
.setHook("snackbar", useSnackbar)
36+
// .setHook("hook1", useHook1)
37+
// .setHook("hookWithArguments", useHookWithArguments.bind(null, arg1, arg2))
38+
// .setHook("hook3", useHook3);
39+
40+
const App = ()=> {
41+
return (
42+
<div>
43+
...
44+
<ReactHooksWrapper />
45+
</div>
46+
);
4247
}
4348

4449
render(<App />, document.getElementById('root'));
4550
```
46-
Then you can call the hook from any place you want
47-
```javascript
48-
import { getHook } from "react-hook-outside";
51+
Then you can call the hook from any place you want
52+
```javascript
53+
import { getHook } from "react-hooks-outside";
4954

50-
function goToPage(pathname){
51-
const history = getHook("history");
52-
history.push(pathname);
55+
function goToPage(pathname){
56+
const history = getHook("history");
57+
history.push(pathname);
5358
}
5459
```

0 commit comments

Comments
 (0)