diff --git a/components/comment/Editor.tsx b/components/comment/Editor.tsx
index 0067675c1e..b6a56cf0cc 100644
--- a/components/comment/Editor.tsx
+++ b/components/comment/Editor.tsx
@@ -3,7 +3,6 @@ import classNames from 'classnames';
export interface CommentEditorProps {
avatar: React.ReactNode;
- children?: React.ReactNode;
className?: string;
editorStyle?: React.CSSProperties;
headStyle?: React.CSSProperties;
@@ -16,7 +15,6 @@ export interface CommentEditorProps {
export default (props: CommentEditorProps) => {
const {
avatar,
- children,
className,
content,
editorStyle,
diff --git a/components/comment/Nested.tsx b/components/comment/Nested.tsx
deleted file mode 100644
index 52cbe40755..0000000000
--- a/components/comment/Nested.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import * as React from 'react';
-import classNames from 'classnames';
-
-export interface NestedCommentProps {
- prefixCls?: string;
- style?: React.CSSProperties;
- className?: string;
- children: React.ReactNode;
-}
-
-export default (props: NestedCommentProps) => {
- const { prefixCls = 'ant-comment', className, ...others } = props;
- const classString = classNames(`${prefixCls}-nested`, className);
- return
;
-};
diff --git a/components/comment/index.en-US.md b/components/comment/index.en-US.md
index 36b3b13919..1974d8110d 100644
--- a/components/comment/index.en-US.md
+++ b/components/comment/index.en-US.md
@@ -18,8 +18,8 @@ Comments can be used to enable discussions on an entity for example page, blog p
| actions | List of action items rendered below the comment content | Array | - |
| author | The element to display as the comment author | ReactNode | - |
| avatar | The element to display as the comment avatar - generally an antd `Avatar` | ReactNode | - |
-| className | className of comment | string | - |
| children | Nested comments should be provided as children of the Comment | ReactNode | - |
+| className | className of comment | string | - |
| content | The main content of the comment | ReactNode | - |
| contentStyle | Inline style to apply to the comment content | object | - |
| headStyle | Inline style to apply to the comment head | object | - |
@@ -34,11 +34,11 @@ Comments can be used to enable discussions on an entity for example page, blog p
| Property | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
-| prefixCls | prefix className defaults to `.ant-comment` | string | .ant-comment |
-| style | Additional style for the editor | object | - |
+| avatar | The element to display as the comment avatar - generally an antd `Avatar` | ReactNode | - |
| className | className of editor | string | - |
-| headStyle | Inline style to apply to the comment head | object | - |
+| content | The element to display as the editor | ReactNode | - |
| editorStyle | Inline style to apply to the comment editor | object | - |
+| headStyle | Inline style to apply to the comment head | object | - |
| innerStyle | Inline style to apply to the comment inner comment editor | object | - |
-| avatar | The element to display as the comment avatar - generally an antd `Avatar` | ReactNode | - |
-| children | The element to display as the editor | ReactNode | - |
+| prefixCls | prefix className defaults to `.ant-comment` | string | .ant-comment |
+| style | Additional style for the editor | object | - |
diff --git a/components/comment/index.tsx b/components/comment/index.tsx
index 4000a0f9d9..151127f605 100644
--- a/components/comment/index.tsx
+++ b/components/comment/index.tsx
@@ -1,10 +1,8 @@
import * as React from 'react';
import classNames from 'classnames';
import Tooltip from '../tooltip';
-import Nested from './Nested';
import Editor from './Editor';
-export { NestedCommentProps } from './Nested';
export { CommentEditorProps } from './Editor';
export interface CommentProps {
@@ -54,6 +52,17 @@ export default class Comment extends React.Component {
return actionList;
}
+ renderNested = (child: React.ReactElement) => {
+ const { prefixCls = 'ant-comment' } = this.props;
+ const classString = classNames(`${prefixCls}-nested`);
+
+ return (
+
+ {child}
+
+ )
+ }
+
render() {
const {
actions,
@@ -131,7 +140,7 @@ export default class Comment extends React.Component {
const nestedComments =
React.Children.toArray(children).map((child: React.ReactElement) =>
- React.cloneElement({child}, {}));
+ React.cloneElement(this.renderNested(child), {}));
return (
diff --git a/components/comment/index.zh-CN.md b/components/comment/index.zh-CN.md
index 4ae9051c56..63500ca751 100644
--- a/components/comment/index.zh-CN.md
+++ b/components/comment/index.zh-CN.md
@@ -19,8 +19,8 @@ cols: 1
| actions | 在评论内容下面呈现的操作项列表 | Array | - |
| author | 要显示为注释作者的元素 | ReactNode | - |
| avatar | 要显示为评论头像的元素 - 通常是antd `Avatar` | ReactNode | - |
-| className | 网格容器类名 | string | - |
| children | 嵌套注释应作为注释的子项提供 | ReactNode | - |
+| className | 网格容器类名 | string | - |
| content | 评论的主要内容 | ReactNode | - |
| contentStyle | 要应用于评论内容的内联样式 | object | - |
| headStyle | 要应用于注释头的内联样式 | object | - |
@@ -35,11 +35,11 @@ cols: 1
| Property | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
-| prefixCls | prefix className默认为`.ant-comment` | string | .ant-comment |
-| style | 编辑器的其他样式 | object | - |
+| avatar | 要显示为评论头像的元素 - 通常是antd `Avatar` | ReactNode | - |
| className | 编辑器的className | string | - |
-| headStyle | 要应用于注释头的内联样式 | object | - |
+| content | 要显示为编辑器的元素 | ReactNode | - |
| editorStyle | 要应用于注释编辑器的内联样式 | object | - |
+| headStyle | 要应用于注释头的内联样式 | object | - |
| innerStyle | 要应用于注释内部注释编辑器的内联样式 | object | - |
-| avatar | 要显示为评论头像的元素 - 通常是antd `Avatar` | ReactNode | - |
-| children | 要显示为编辑器的元素 | ReactNode | - |
+| prefixCls | prefix className默认为`.ant-comment` | string | .ant-comment |
+| style | 编辑器的其他样式 | object | - |