评论 Comment
展示评论信息
安装
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 无法渲染。
示例
- 基础用法
- 对齐:通过
align属性可以设置datetime和actions的对齐方式. - 嵌套评论
- 配合List使用:配合 List 组件展现评论列表。
- 回复框
示例来自 Arco Design 官方仓库(MIT),固定在 npm 2.66.18 对应的提交;部分示例使用在线图片或上传地址,预览中网络请求被禁用。
API
Comment
| 参数名 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| align | 靠左/靠右 展示 datetime 和 actions | | 'left'| 'right'| {datetime?: 'left' | 'right';actions?: 'left' | 'right';} | - |
| actions | 操作列表 | ReactNode | - |
| author | 作者名 | ReactNode | - |
| avatar | 头像 | ReactNode | - |
| content | 评论内容 | ReactNode | - |
| datetime | 时间描述 | ReactNode | - |
| className | 节点类名 | string | string[] | - |
| style | 节点样式 | CSSProperties | - |