Result
Used to give feedback on the result of user's operation or access exception.
Basic usage
primary has been added in 2.9.11.
Please follow the instructions
Please follow the instructions
Please follow the instructions
Please follow the instructions
export function ResultBasic() { return ( <ElRow> <ElCol sm={12} lg={6} xl={4}> <ElResult icon="primary" title="Primary Tip" subTitle="Please follow the instructions" extra={<ElButton type="primary">Back</ElButton>} /> </ElCol> <ElCol sm={12} lg={6} xl={4}> <ElResult icon="success" title="Success Tip" subTitle="Please follow the instructions" extra={<ElButton type="primary">Back</ElButton>} /> </ElCol> <ElCol sm={12} lg={6} xl={4}> <ElResult icon="warning" title="Warning Tip" subTitle="Please follow the instructions" extra={<ElButton type="primary">Back</ElButton>} /> </ElCol> <ElCol sm={12} lg={6} xl={4}> <ElResult icon="error" title="Error Tip" subTitle="Please follow the instructions" extra={<ElButton type="primary">Back</ElButton>} /> </ElCol> <ElCol sm={12} lg={6} xl={4}> <ElResult icon="info" title="Info Tip" subTitle={<p>Using slot as subtitle</p>} extra={<ElButton type="primary">Back</ElButton>} /> </ElCol> </ElRow> );}
Customized content
export function ResultCustomIcon() { return ( <ElResult title="404" subTitle="Sorry, request error" customIcon={<ElImage src={HAMBURGER} />} extra={<ElButton type="primary">Back</ElButton>} /> );}
API
Attributes
| Name | Description | Type | Default |
|---|
| title | title of result | string | '' |
| sub-title | sub title of result | string | '' |
| icon | icon type of result | enum | info |
Slots
| Name | Description |
|---|
| icon | content as result icon |
| title | content as result title |
| sub-title | content as result sub title |
| extra | content as result extra area |