hooks
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
import React, {useReducer} from 'react';
const reducer = (state, action) => {
switch(action.type) {
case 'CHANGE':
return action.value;
default:
return state;
}
}
const useInput = (type, initialState) => {
const [state, dispatch] = useReducer(reducer, initialState);
const onChange = (e) => {
dispatch({type, value: e.target.value})
}
return [state, onChange]
}
const CustomHooks = () => {
const [state, onChange] = useInput('CHANGE', 'initial state');
return (
<div>
<h1>Custom Hooks</h1>
<h3>{state}</h3>
<input type='text' value={state} onChange={onChange} />
</div>
)
}
export default CustomHooks;
Link
https://gist.github.com/ninanung/cb199ad80ac29da4ca6111b970956d79