A deferred task React Hook is a lightweight wrapper for an asynchronous function. It allows tracking of the task's execution status and provides access to the last error that occurred during the task's execution, if any.
const { called, loading, data, error, execute }: UseDeferredTask<TData, TError, TInput> = useAnyDeferredTask();if (!called) { // data === undefined // error === undefined return <p>Click the button to execute the task</p>;}if (loading) { // data === undefined on first call // data === TData from previous successful call // error === undefined return <Loader />;}if (error) { // data === undefined // error === TError return <p>Something went wrong: {error.message}</p>;}// called === true// data === TData// error === undefinedreturn <p>Task completed: {data}</p>; Copy
const { called, loading, data, error, execute }: UseDeferredTask<TData, TError, TInput> = useAnyDeferredTask();if (!called) { // data === undefined // error === undefined return <p>Click the button to execute the task</p>;}if (loading) { // data === undefined on first call // data === TData from previous successful call // error === undefined return <Loader />;}if (error) { // data === undefined // error === TError return <p>Something went wrong: {error.message}</p>;}// called === true// data === TData// error === undefinedreturn <p>Task completed: {data}</p>;
A deferred task React Hook is a lightweight wrapper for an asynchronous function. It allows tracking of the task's execution status and provides access to the last error that occurred during the task's execution, if any.