reactjs - 如何使用 react redux 和 firebase connect 更改帖子中的评论

Question

我正在尝试克隆 instagram，目前我被困在评论部分，当我尝试添加评论时，所有帖子都会添加相同的评论。我将我的评论存储在 Firestore 中，并且它被正确保存，但我无法弄清楚如何管理状态，以便只有那些帖子应该反映添加评论的更改。

这是 showcomments 组件的以下代码，它将在另一个组件中使用。谁能帮我解决这个问题。

import React from "react";
import { connect } from "react-redux";
import { firestoreConnect } from "react-redux-firebase";
import { compose } from "redux";
import { makeStyles } from "@material-ui/styles";



const useStyles = makeStyles((theme) => ({
      comment: {
      marginTop: "1rem",
    },
    postCaption: {
      ...theme.typography.postCaption,
    },
    username: {
      ...theme.typography.username,
    },
  }));


function ShowComments(props) {
  const classes = useStyles();
  const { comments } = props;

  const renderComments = () => {
    if (comments) {
      return comments.map((comment) => {
        return (
          <h3 key={comment.id}>
            {comment.username}{" "}
            <span className={classes.postCaption}>{comment.comment}</span>
          </h3>
        );
      });
    }
  };

  return (
    <div>
      {console.log(props.postId)}
      {renderComments()}
    </div>
  );
}

const mapStateToProps = (state) => {
  console.log(state);
  return {
    comments: state.firestore.ordered.comments,
  };
};

export default compose(
  connect(mapStateToProps),
  firestoreConnect((props) => {
    return [
      {
        collection: "instagramPosts",
        doc: props.postId,
        subcollections: [{ collection: "comments" }],
        storeAs: "comments",
      },
    ];
  })
)(ShowComments);