File tree 5 files changed +64
-0
lines changed
5 files changed +64
-0
lines changed Original file line number Diff line number Diff line change 74
74
<br />
75
75
<br />
76
76
- [ ** State** ] ( ./docs/State.md )
77
+ - [ ` createMemo ` ] ( ./docs/createMemo.md ) &mdash ; creates a memoized hook.
77
78
- [ ` useGetSet ` ] ( ./docs/useGetSet.md ) &mdash ; returns state getter ` get() ` instead of raw state.
78
79
- [ ` useGetSetState ` ] ( ./docs/useGetSetState.md ) &mdash ; as if [ ` useGetSet ` ] ( ./docs/useGetSet.md ) and [ ` useSetState ` ] ( ./docs/useSetState.md ) had a baby.
79
80
- [ ` useObservable ` ] ( ./docs/useObservable.md ) &mdash ; tracks latest value of an ` Observable ` .
Original file line number Diff line number Diff line change
1
+ # ` createMemo `
2
+
3
+ A factory that returns a React hook, which is memoized for each set of arguments passed to it.
4
+
5
+
6
+ ## Usage
7
+
8
+ ``` jsx
9
+ import {createMemo } from ' react-use' ;
10
+
11
+ const fibonacci = n => {
12
+ if (n === 0 ) return 1 ;
13
+ if (n === 1 ) return 2 ;
14
+ return fibonacci (n - 1 ) + fibonacci (n - 2 );
15
+ };
16
+
17
+ const useMemoFibonacci = createMemo (fibonacci);
18
+
19
+ const Demo = () => {
20
+ const result = useMemoFibonacci (10 );
21
+
22
+ return (
23
+ < div>
24
+ fib (10 ) = {result}
25
+ < / div>
26
+ );
27
+ };
28
+ ```
Original file line number Diff line number Diff line change
1
+ import * as React from 'react' ;
2
+ import { storiesOf } from '@storybook/react' ;
3
+ import { createMemo } from '..' ;
4
+ import ShowDocs from '../util/ShowDocs' ;
5
+
6
+ const fibonacci = n => {
7
+ if ( n === 0 ) return 1 ;
8
+ if ( n === 1 ) return 2 ;
9
+ return fibonacci ( n - 1 ) + fibonacci ( n - 2 ) ;
10
+ } ;
11
+
12
+ const useMemoFibonacci = createMemo ( fibonacci ) ;
13
+
14
+ const Demo = ( ) => {
15
+ const result = useMemoFibonacci ( 10 ) ;
16
+
17
+ return (
18
+ < div >
19
+ fib(10) = { result }
20
+ </ div >
21
+ ) ;
22
+ } ;
23
+
24
+ storiesOf ( 'createMemo' , module )
25
+ . add ( 'Docs' , ( ) => < ShowDocs md = { require ( '../../docs/createMemo.md' ) } /> )
26
+ . add ( 'Demo' , ( ) =>
27
+ < Demo />
28
+ )
Original file line number Diff line number Diff line change
1
+ import { useMemo } from './react' ;
2
+
3
+ const createMemo = fn => ( ...args ) => useMemo ( ( ) => fn ( ...args ) , args ) ;
4
+
5
+ export default createMemo ;
Original file line number Diff line number Diff line change
1
+ import createMemo from './createMemo' ;
1
2
import useAsync from './useAsync' ;
2
3
import useAudio from './useAudio' ;
3
4
import useBattery from './useBattery' ;
@@ -38,6 +39,7 @@ import useUpdate from './useUpdate';
38
39
import useWindowSize from './useWindowSize' ;
39
40
40
41
export {
42
+ createMemo ,
41
43
useAsync ,
42
44
useAudio ,
43
45
useBattery ,
You can’t perform that action at this time.
0 commit comments