Error Boundaries
Error Boundary, EK, CLASS, COMPONENT, hai (FUNCTIONAL, COMPONENTS, MEIN, ABHI, TAK, EQUIVALENT, HOOK, NAHI, hai), JO, static getDerivedStateFromError() aur, componentDidCatch() LIFECYCLE, METHODS, IMPLEMENT, KARTA, hai — CHILD, COMPONENT, TREE, MEIN, JavaScript, ERRORS, KO, "CATCH" KARTA, hai.
BINA, Error, Boundary, KE, EK, COMPONENT, MEIN, RENDERING, ERROR, POORI, APPLICATION, KO, "WHITE, SCREEN" (UNMOUNT) KAR, DETA, hai — Error Boundary, ISE, ISOLATE, KARTA, hai, aur, EK, FALLBACK, UI, DIKHATA, hai.
class ErrorBoundary extends React.Component {
state = { hasError: false };
static getDerivedStateFromError(error) {
return { hasError: true };
}
componentDidCatch(error, info) {
console.error("Caught error:", error, info);
}
render() {
if (this.state.hasError) {
return <h2>Something went wrong.</h2>;
}
return this.props.children;
}
}
// Usage:
<ErrorBoundary>
<RiskyComponent />
</ErrorBoundary>- Error Boundary = class component, JO, child, tree, mein, errors, CATCH, karta hai
- Bina, error boundary, ke, EK, error, POORI, app, ko, "WHITE, SCREEN", KAR, sakta hai
- Event handlers, ke, andar, errors, NAHI, catch, karte — try-catch, USE, karo
react-error-boundary, EK, POPULAR, LIBRARY, hai, JO, ErrorBoundary, KO, EK, PROP-BASED, COMPONENT, KI, TARAH, DETI, hai (CLASS, COMPONENT, MANUALLY, LIKHNE, KI, ZAROORAT, NAHI) — FallbackComponent, aur, onReset, PROPS, KE, SAATH.
<ErrorBoundary FallbackComponent={ErrorFallback} onReset={() => window.location.reload()}>
<App />
</ErrorBoundary>EK, HI, ERROR, BOUNDARY, POORI, APP, KO, WRAP, KARNE, KE, BAJAYE, MULTIPLE, ERROR, BOUNDARIES, DIFFERENT, SECTIONS, KO, WRAP, KAR, SAKTE, HAIN — EK, SECTION, MEIN, ERROR, AANE, PAR, BAAKI, APP, (jaise, NAVIGATION) FUNCTIONAL, REHTI, hai.