react-life-hooks
v1.1.2
Published
React hooks for better managing lifecycles for function component.
Downloads
14
Maintainers
Readme
react-life-hooks
React hooks for better managing lifecycles for function component.
This lib want keep as helpers
, but not targeting a fully Custom Hooks.
Install
You can install from NPM, or use files in lib
.
npm install --save react-life-hooks
Usage
This lib require React 16.8.0 or later, since it's based on React Hooks API.
Each helper can be imported individually:
import {
onInit,
onDidMount,
onDidUpdate,
onWillUnmount,
onChange,
useLifeState,
} from 'react-life-hooks'
function Hello(props){
onInit(()=>{
console.log('this is like constructor');
})
onDidMount(()=>{
console.log('this is like componentDidMount');
});
onDidUpdate(()=>{
console.log('this is like componentDidUpdate');
});
onWillUnmount(()=>{
console.log('this is like componentWillUnmount');
});
onChange(props, prevProps=>{
console.log('this is like componentWillReceiveProps')
})
// state, setState is life time, same reference in each render
const [state, setState] = useLifeState({x:1})
// below have no bugs any more
const onClick = () => {
setState({x: state.x+1})
}
return <div>
<span>{state.x}</span>
<button onClick={onClick}></button>
</div>
};