React nextTick
Table of contents
Overview
A React equivalent of Vue's nextTick() function.
Installation
npm install react-next-tick
ESLint configuration
module.exports = {
rules: {
...
"react-hooks/exhaustive-deps": [
"warn",
{ additionalHooks: "^useNextTick$" }
],
...
}
}
Usage
import * as React from "react";
import { useNextTick } from "react-next-tick";
function Component(): React.JSX.Element {
const [value, setValue] = React.useState(0);
const deferred = useNextTick(() => {
console.log(value);
}, [value]);
return (
<button onClick={clickHandler} type="button">
Sample button
</button>
);
function clickHandler(): void {
setValue(1);
deferred.immediate(); // Output: 0
deferred(); // Output: 1
}
}
Related packages
- eslint-plugin-misc — ESLint plugin.
- quasar-extension — Quasar extension.
- real-fns — A collection of utility functions.
- real-classes — A collection of utility classes.
- real-facades — Facades (each facade provides interface to pluggable implementation).
- real-service-providers — Facade implementations.