UNPKG

@rbxts/pretty-react-hooks

Version:
51 lines (38 loc) 1.31 kB
## 🪝 `useAsync` ```ts function useAsync<T>( callback: () => Promise<T>, deps: unknown[] = [], ): [result?: T, status?: Promise.Status, message?: unknown]; ``` A hook that runs an async function and returns the result and status. Similar to `useAsyncCallback`, but the callback is run on mount and whenever the dependencies change. Changing the dependencies will cancel any pending promises and start a new one. > **Warning:** > Cancelling a promise that yielded using `await` does not prevent the thread from resuming. > Avoid pairing `await` with functions that update state, as it might resume after unmount: > > ```ts > useAsync(async () => { > await Promise.delay(5); > setState("Hello World!"); // unsafe > }); > ``` ### 📕 Parameters - `callback` - The async function to run. - `deps` - The dependencies to watch for changes. Defaults to an empty array. ### 📗 Returns - The result if the promise resolved. - The status of the promise. - The error message if the promise rejected or cancelled. ### 📘 Example ```tsx function BaseplatePortal(props: React.PropsWithChildren) { const [baseplate] = useAsync(async () => { return Workspace.WaitForChild("Baseplate"); }); if (!baseplate) { return undefined!; } return createPortal(props.children, baseplate); } ```