Catch
A tradução desta página não existe ou está desatualizada, por isso é mostrada em inglês. Ler em inglês
Replace failing child content with a recovery UI. Use it around independently recoverable sections.
Retry a failed profile load
import { Button, Catch, Text, VStack, resource } from 'kuito';
function Profile() {
const user = resource(async () => {
const response = await fetch('https://example.com/me');
if (!response.ok) throw new Error(`HTTP ${response.status}`);
return (await response.json()) as { name: string };
});
return <Text>{user.data.value?.name ?? ''}</Text>;
}
export default function Account() {
return (
<Catch
fallback={(error, retry) => (
<VStack gap={8}>
<Text>{'Could not load: ' + String(error)}</Text>
<Button onPress={retry}>Try again</Button>
</VStack>
)}
>
<Profile />
</Catch>
);
}Behavior
The fallback receives the error and a retry callback. Retry mounts fresh children. Catch handles render, lifecycle and unhandled initial resource failures; handle event-handler and task promise rejections at their call sites.
Continue
Read Async for a complete workflow. See the complete prop reference for types and documented defaults.
Referência
Assinaturas
Props: CatchProps
Props (incluindo props herdadas) 3
Gerado a partir das declarações TypeScript públicas: assinaturas, props e predefinições vêm da fonte verificada, as descrições da sua JSDoc. Nenhuma predefinição é inventada.