Проблема запроса данных на основе параметров URL в React-Redux - PullRequest
0 голосов
/ 10 февраля 2020

В приложении MERN-стека я хотел бы запросить данные из схемы конкретного пользователя на основе параметров url. Например, http://localhost: 3000 / user / User1 будет отображать данные от пользователя 1. Я использую redux-реагировать для управления состоянием. Вот то, что у меня сейчас есть, и вот что происходит.

Компонент страницы пользователя

import React, { Component } from "react";
import {getUser} from '../../actions/userActions'; 
import {connect} from 'react-redux'

class Userpage extends Component {

  componentDidMount() {
      getUser(this.props.match.params.username)
 }

  render() {
    return (
     <div>
         <h1>Hello</h1>
         <h3>{this.props.user.name}</h3>
         <h3>{this.props.user.email}</h3>
     </div>
    );
  }
}


const mapStatetoProps = state => {
    return{user: state.user}
}; 

export default connect(mapStatetoProps, getUser) (Userpage) 

userActions

import axios from 'axios'; 
import {GET_USER} from './types'; 

export const getUser = username => dispatch => {
    axios
    .get(`/api/users/${username}`)
    .then(({res}) => 
        dispatch({
            type: GET_USER, 
            payload: username
        })
    )
}; 

userReducer

import { GET_USER } from "../actions/types";

const initialState = {
  user: {}, 
};

export default function(state = initialState, action) {
  switch (action.type) {
    case GET_USER:
      return{
        ...state,
        user: action.payload, 
      }
}

Затем в маршруте api / users у меня есть следующее:

router.get("/:username", (req, res) => {
  User.findOne({username: req.params.username})
  .then(user => res.json(user))
}); 

Помимо состояния пользователя, возвращающегося пустым, вот некоторые ошибки, которые я получаю. В командной строке я иногда получаю

Не удалось запросить прокси / api / users / function% 20 (действие)% 20% 7B% 20% 20% 20% 20% 20% 20% 20% 20if% 20 (TypeOf% 20action% 20% === 20'function ')% 20% 7B% 20% 20% 20% 20% 20% 20% 20% 20% 20% 20return% 20action (отправка,% 20getState,% 20extraArgument);% 20% 20% 20% 20% 20% 20% 20% 20% 7D% 20% 20% 20% 20% 20% 20% 20% 20return% 20дальше (действие);% 20% 20 % 20% 20% 20% 20% 7D с локального хоста: от 3000 до http://localhost: 5000 .

, а также

mapDispatchToProps () в Connect (Userpage) должен возвращать простой объект. Вместо этого получил неопределенный.

Любая помощь или руководство будет принята с благодарностью.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...