结果 Result
用于反馈一系列操作任务的处理结果,当有重要操作需告知用户处理结果,且反馈内容较为复杂时使用。
安装
npm install @arco-design/web-react@2.66.18
在入口引入 @arco-design/web-react/dist/css/arco.css,用 ConfigProvider 设置语言。React 19 项目还需在入口最先引入 @arco-design/web-react/es/_util/react-19-adapter,否则 Message、Modal 等命令式 API 无法渲染。
示例
- Success:展示成功状态。
- Info:展示处理结果
- warning:警告状态。
- Error:错误状态。
- '_403':没有当前页面的访问权限。
- _404:页面未找到
- _500:通常表示服务器错误
- 自定义icon:通过
Icon属性自定义图标 - 完整功能:体现全部功能。
示例来自 Arco Design 官方仓库(MIT),固定在 npm 2.66.18 对应的提交;部分示例使用在线图片或上传地址,预览中网络请求被禁用。
API
Result
| 参数名 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| status | 不同状态,传入 null 时,需要通过 icon 属性设置图标,并且默认没有背景色以及图标颜色 | 'success' | 'error' | 'info' | 'warning' | '404' | '403' | '500' | null | info |
| extra | 额外内容 | ReactNode | - |
| icon | 自定义图标 | ReactNode | - |
| subTitle | 子标题文字 | ReactNode | - |
| title | 标题文字 | ReactNode | - |
| className | 节点类名 | string | string[] | - |
| style | 节点样式 | CSSProperties | - |