Проблема с получением сообщения по идентификатору с использованием стека MERN и redux - PullRequest
0 голосов
/ 04 августа 2020

Я работаю над веб-сайтом, где есть чаты, и в чатах пользователи могут публиковать сообщения, и к этому сообщению могут быть комментарии. Когда кто-то находится в чате, он может видеть все сообщения в этом чате, а когда они нажимают на сообщение, он направляет их на страницу с этим сообщением и комментариями. Моя проблема в том, что мое действие redux вызывает ошибку, что странно, потому что, когда я использую почтальон для получения сообщения, он работает. Это заставляет меня поверить, что в моем действии redux есть ошибка, но я не могу найти, где я ошибся. Когда я получаю сообщение, я сначала получаю его, получая идентификатор чата из чата, в котором он находится, а затем идентификатор сообщения. Ниже я включил компонент Post, действие getPostById и редуктор профиля, который я использую для публикации (GET_POST и RETRIEVE_ERROR - это соответствующие типы, однако RETRIEVE_ERROR - это то, что отправляется). Любая помощь очень ценится. Спасибо!

Компонент сообщения:

import React, { Fragment, useEffect } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { getPostById } from '../../actions/profile';

const Post = ({
  getPostById,
  profile: { post },
  match }) => {
  useEffect(() => {
    getPostById(match.params.chatId, match.params.postId)
  }, [])


  return <Fragment>
    Test
  </Fragment>

}

//chat.posts ? <Fragment>
//<h1>{post.title}</h1>
//</Fragment> : <h1>Post doesn't exist</h1>

Post.propTypes = {
  getPostById: PropTypes.func.isRequired,
  post: PropTypes.object.isRequired
}

const mapStateToProps = state => ({
  profile: state.profile
});

export default connect(mapStateToProps, { getPostById })(Post);

действие getPostById:

 // Get requested post
export const getPostById = (chatId, postId) => async dispatch => {
  try {
    const res = await axios.get(`/api/chats/posts/${chatId}/${postId}`);

    dispatch({
      type: GET_POST,
      payload: res.data
    });

  } catch (err) {
    dispatch({
      type: RETRIEVE_FAIL,
      payload: { msg: err.response.statusText, status: err.response.status }
    })
  }
};

редуктор профиля:

    import {
  GET_PROFILE,
  PROFILE_ERROR,
  CLEAR_PROFILE,
  GET_CHAT,
  GET_FAIL,
  GET_POST,
  RETRIEVE_FAIL
} from '../actions/types';

const initialState = {
  profile: null,
  loading: true,
  error: {},
  chat: null,
  post: null
}

export default function (state = initialState, action) {
  const { type, payload } = action;

  switch (type) {
    case GET_PROFILE:
      return {
        ...state,
        profile: payload,
        loading: false
      };
    case GET_CHAT:
      return {
        ...state,
        chat: payload,
        loading: false
      }
    case GET_POST:
      return {
        ...state,
        post: payload,
        loading: false
      }
    case PROFILE_ERROR:
    case GET_FAIL:
    case RETRIEVE_FAIL:
      return {
        ...state,
        error: payload,
        loading: false
      };
    case CLEAR_PROFILE:
      return {
        ...state,
        profile: null,
        loading: false
      }
    default:
      return state;
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...