import React, { Component } from "react"; import PropTypes from "prop-types"; import { Avatar, Icon } from "antd"; import dayjs from "dayjs"; import Comment from "../../Comment"; import CommentInput from "../CommentInput"; import avatar from "../../avatar"; import { renderContent } from "../../helper"; import "./index.css"; class CommentItem extends Component { constructor(props) { super(props); this.state = { showInput: false }; this.handleToggleInput = this.handleToggleInput.bind(this); this.renderTextWithReply = this.renderTextWithReply.bind(this); } handleToggleInput() { this.setState({ showInput: !this.state.showInput }); } renderTextWithReply(text, content) { let newText = text; const { reply } = content; if (reply) { newText = `${newText} //@${ reply.user_name } ${reply.content}`; if (reply.reply) { return this.renderTextWithReply(newText, reply); } } return newText; } render() { const { commentId, replyId, content, action, showReply, onShowReply, app } = this.props; const { showInput } = this.state; return (
{content.user_name || "暂无昵称"} {dayjs(content.created * 1000).format("YYYY-MM-DD HH:mm:ss")}
{content.reply_count ? (
{content.reply_count} 条回复 {showReply ? : }
) : null}   回复
{ if (replyId) { // 如果有 replyId,则说明是评论的回复 app.sReplyFavor(content.id, commentId, content.favored); return; } app.sCommentFavor(content.id, content.favored); }} >  {content.favor_count}
{showInput && ( )}
); } } CommentItem.propTypes = { content: PropTypes.object.isRequired, // comment 评论 // reply 评论的回复 // replyToReply 回复的回复 action: PropTypes.oneOf(["comment", "reply", "replyToReply"]), onShowReply: PropTypes.func }; CommentItem.defaultProps = { action: "comment", onShowReply: () => {} }; export default Comment(CommentItem);