mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-16 01:29:11 +08:00
4621bd9f5e
* feat: Alert support id and ref * test: add test case * chore: adjust ts def --------- Co-authored-by: 二货机器人 <smith3816@gmail.com>
54 lines
1.3 KiB
TypeScript
54 lines
1.3 KiB
TypeScript
import * as React from 'react';
|
|
|
|
import Alert from './Alert';
|
|
|
|
interface ErrorBoundaryProps {
|
|
message?: React.ReactNode;
|
|
description?: React.ReactNode;
|
|
children?: React.ReactNode;
|
|
id?: string;
|
|
}
|
|
|
|
interface ErrorBoundaryStates {
|
|
error?: Error | null;
|
|
info?: {
|
|
componentStack?: string;
|
|
};
|
|
}
|
|
|
|
class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryStates> {
|
|
state = {
|
|
error: undefined,
|
|
info: {
|
|
componentStack: '',
|
|
},
|
|
};
|
|
|
|
componentDidCatch(error: Error | null, info: object) {
|
|
this.setState({ error, info });
|
|
}
|
|
|
|
render() {
|
|
const { message, description, id, children } = this.props;
|
|
const { error, info } = this.state;
|
|
const componentStack = info && info.componentStack ? info.componentStack : null;
|
|
const errorMessage = typeof message === 'undefined' ? (error || '').toString() : message;
|
|
const errorDescription = typeof description === 'undefined' ? componentStack : description;
|
|
if (error) {
|
|
return (
|
|
<Alert
|
|
id={id}
|
|
type="error"
|
|
message={errorMessage}
|
|
description={
|
|
<pre style={{ fontSize: '0.9em', overflowX: 'auto' }}>{errorDescription}</pre>
|
|
}
|
|
/>
|
|
);
|
|
}
|
|
return children;
|
|
}
|
|
}
|
|
|
|
export default ErrorBoundary;
|