ErrorBoundary: use correct types for child components/fallbacks
This commit is contained in:
@@ -1,22 +1,29 @@
|
|||||||
import React, { ErrorInfo } from "react";
|
import React, { ErrorInfo } from "react";
|
||||||
|
|
||||||
interface ErrorBoundaryProps {
|
interface ErrorBoundaryProps {
|
||||||
fallback?: JSX.Element;
|
fallback?: JSX.Element | React.ReactNode;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default class ErrorBoundary extends React.Component<ErrorBoundaryProps> {
|
interface ErrorBoundaryState {
|
||||||
state = { errorMessage: "" };
|
errorMessage?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
|
||||||
|
constructor(props: any) {
|
||||||
|
super(props);
|
||||||
|
this.state = { errorMessage: "" }
|
||||||
|
}
|
||||||
|
|
||||||
static getDerivedStateFromError(error: any) {
|
static getDerivedStateFromError(error: any) {
|
||||||
return { errorMessage: error.toString() };
|
return { errorMessage: error.toString() };
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidCatch(error: any, info: ErrorInfo) {
|
componentDidCatch(error: any, info: ErrorInfo) {
|
||||||
console.error(error);
|
void(error);
|
||||||
console.info(info);
|
console.info(info);
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render(): JSX.Element | React.ReactNode {
|
||||||
if (this.state.errorMessage) {
|
if (this.state.errorMessage) {
|
||||||
return this.props.fallback ?? <p>{this.state.errorMessage}</p>;
|
return this.props.fallback ?? <p>{this.state.errorMessage}</p>;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user