Exception

Exceptions page is used to provide feedback on specific abnormal state. Usually, it contains an explanation of the error status, and provides users with suggestions or operations, to prevent users from feeling lost and confused.

Usage:

import Exception from 'ant-design-pro/lib/Exception';

Learning more to visit: Using Pro Components Alone

Examples

404 Page

404 page.

expand codeexpand code
import Exception from 'ant-design-pro/lib/Exception';

ReactDOM.render(<Exception type="404" />, mountNode);
500 Page

500 page.

expand codeexpand code
import Exception from 'ant-design-pro/lib/Exception';

ReactDOM.render(<Exception type="500" />, mountNode);
403 Page

403 page with custom operations.

expand codeexpand code
import Exception from 'ant-design-pro/lib/Exception';
import { Button } from 'antd';

const actions = (
  <div>
    <Button type="primary">Home</Button>
    <Button>Detail</Button>
  </div>
);
ReactDOM.render(<Exception type="403" actions={actions} />, mountNode);

API#

Property Description Type Default
backText default return button text ReactNode back to home
type type of exception, the corresponding default title, desc, img will be given if set, which can be overridden by explicit setting of title, desc, img Enum {'403', '404', '500'} -
title title ReactNode -
desc supplementary description ReactNode -
img the url of background image string -
actions suggested operations, a default 'Home' link will show if not set ReactNode -
linkElement to specify the element of link string|ReactElement 'a'
redirect redirect path string '/'
DescriptionListFooterToolbar