react antd评论

如果您想在 React 中使用 Ant Design 的评论组件，可以按照以下步骤操作：

1. 安装 Ant Design 和所需的依赖项：

   npm install antd react react-dom

2. 导入所需的组件：

   import { Comment, Avatar, Form, Button, List, Input } from 'antd';

3. 创建一个评论组件并设置相关状态：

   const [comments, setComments] = useState([]);
   const [submitting, setSubmitting] = useState(false);
   const [value, setValue] = useState('');

4. 创建一个 handleSubmit 函数来处理评论提交：

   const handleSubmit = () => {
     if (!value) {
       return;
     }
     setSubmitting(true);
     setTimeout(() => {
       setSubmitting(false);
       setComments([
         ...comments,
         {
           author: '匿名用户',
           avatar: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png',
           content: <p>{value}</p>,
           datetime: moment().fromNow(),
         },
       ]);
       setValue('');
     }, 1000);
   };

5. 创建一个 handleChange 函数来处理评论内容的变化：

   const handleChange = e => {
     setValue(e.target.value);
   };

6. 渲染评论组件：

   <Comment
     avatar={<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" alt="匿名用户" />}
     content={
       <Form.Item>
         <Input.TextArea rows={4} onChange={handleChange} value={value} />
       </Form.Item>
     }
     actions={[
       <Button htmlType="submit" loading={submitting} onClick={handleSubmit} type="primary">
         发布评论
       </Button>,
     ]}
   />
   <List
     dataSource={comments}
     itemLayout="horizontal"
     renderItem={props => <Comment {...props} />}
   />

这样就可以在 React 中使用 Ant Design 的评论组件了。需要注意的是，这里使用了一些 ES6 的语法，如箭头函数、解构赋值和模板字符串。如果您不熟悉这些语法，请先学习一下。