1.0.14 ā¢ Published 5 years ago
use-value-after v1.0.14
react hook to use values from an array after delay. when reaching the end of the array it will start from the beginning
š Homepage
Install
npm install
Usage
This hook comes in handy when testing edge cases for a React component by generating a new set of props after a specific delay
import React from 'react'
import ReactDOM from 'react-dom'
import { useValueAfter } from 'use-value-after'
const TestComponent = (props) => {
return (
<div>
<h2>{props.title}</h2>
<p>{props.text}</p>
</div>
)
}
const updatePropsAfterMs = 1000
const testComponentProps = [
{title: '', text: ''},
{title: '', text: 'No title'},
{title: 'Short title', text: ''},
{title: 'Short title', text: 'Really small paragraph'}
]
const App = () => {
const props = useValueAfter(testComponentProps, updatePropsAfterMs)
return (
<div className='App'>
<TestComponent {...props} />
</div>
)
}
ReactDOM.render(<App />, document.getElementById('root'))
CodeSandbox Demo
For a demo take a look here
Author
š¤ Florin Cosmin Onciu
- Twitter: @CosminOnciu
- Github: @bboydflo
š¤ Contributing
Contributions, issues and feature requests are welcome!Feel free to check issues page.
Show your support
Give a āļø if this project helped you!
This README was generated with ā¤ļø by readme-md-generator