如何使用React Redux和Firebase Connect在帖子中更改评论

问题描述

我正在尝试克隆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);

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)

相关问答

依赖报错 idea导入项目后依赖报错,解决方案:https://blog....
错误1:代码生成器依赖和mybatis依赖冲突 启动项目时报错如下...
错误1:gradle项目控制台输出为乱码 # 解决方案:https://bl...
错误还原:在查询的过程中,传入的workType为0时,该条件不起...
报错如下,gcc版本太低 ^ server.c:5346:31: 错误:‘struct...