Sometimes, we want to render React components with promises inside the render method.
In this article, we’ll look at how to render React components with promises inside the render method.
How to render React components with promises inside the render method?
To render React components with promises inside the render method, we use the react-promise library.
To install it, we run
npm i react-promise
Then we use it by writing
import usePromise from "react-promise";
const ExampleWithAsync = (props) => {
const { value, loading } = usePromise(prom);
if (loading) {
return null;
}
return <div>{value}</div>;
};
We call the usePromise hook with the prom promise.
And we get the resolve value of prom from value.
If loading is true, then prom is being run.
Conclusion
To render React components with promises inside the render method, we use the react-promise library.