Collection of useful React hooks
This project uses node and npm.
$ npm install react-easy-hooks
$ # OR
$ yarn add react-easy-hooks
Hook for input values
initial
Any Initial input value (optional, default''
)validation
Function Validation function (optional, default()=>true
)
import { useInput } from 'react-easy-hooks'
const Component = () => {
const name = useInput('Tiaan', (val) => val.length > 3)
return <div>
{!name.valid && 'Invalid'}
<input {...name}/>
</div>
}
Hook to call on component unmount
func
Function Function to call
import { useOnMount } from 'react-easy-hooks'
const Component = () => {
useOnMount(() => { console.log('Mounted!') })
return <h1>Hi</h1>
}
Hook to call on component unmount
func
Function Function to call
import { useOnUnmount } from 'react-easy-hooks'
const Component = () => {
useOnUnmount(() => { console.log('Unmounted!') })
return <h1>Hi</h1>
}
Hook to get previous value of a prop or a state value. Straight out of React docs
value
Any
initial
Boolean Initial value of toggle (optional, defaultfalse
)
import { useToggle } from 'react-easy-hooks'
const Component = () => {
const name = useToggle()
return <div>
<button onClick={name.toggle}>Toggle</button>
{name.isOn && 'Tiaan'}
</div>
}
- Fork it and create your feature branch: git checkout -b my-new-feature
- Commit your changes: git commit -am 'Add some feature'
- Push to the branch: git push origin my-new-feature
- Submit a pull request
MIT