useAsyncValueReturns the resolved data from the nearest <Await> ancestor component.
function ProductVariants() {
const variants = useAsyncValue();
return <div>{/* ... */}</div>;
}
// Await creates the context for the value
<Await resolve={somePromiseForProductVariants}>
<ProductVariants />
</Await>;
See the Deferred Data Guide and <Await> docs for more information.