React / Redux我的reducer返回一个空对象，而我的控制台返回GET 500内部服务器错误错误

问题描述

我的减速器存在问题，基本上，我与使用Laravel构建的外部api通信，当我用Postman测试它，而且解决了（至少我认为）CORS之后，这似乎可以完美地工作起源问题，如果我进入浏览器的“ Redux”选项卡，则状态始终返回空对象，并且在React端，控制台也返回

GET http://localhost:8000/api/teachers 500 (Internal Server Error) 

错误。我只是不明白我的错误是什么，你们中的任何人都可以帮助我找出并解决它吗？

这些是我的组件：

index.js：

import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App';
import "./styles/styles.scss"
import store from "./redux/store";
import {Provider} from "react-redux";



ReactDOM.render(
  <React.StrictMode>
    <Provider store={store}>
      <App />
    </Provider>
  </React.StrictMode>,document.getElementById('root')
);

App.jsx：

import React from 'react';
import { browserRouter as Router,Route,Switch } from "react-router-dom";
import Home from "./Pages/Home";
import Protected from "./Routes/Protected";
import Specialities from "./Pages/Specialities";
import Speciality from "./Pages/Speciality";
import Courses from "./Pages/Courses";
import Course from "./Pages/Course";
import Teachers from "./Pages/Teachers";
import Fragment from "./Pages/Fragment";
import Public from "./Routes/Public";
import Login from "./Pages/Login";
import Register from "./Pages/Register";
import Page404 from "./Pages/Page404";
import Header from "./Organisms/Header";

const App = () => (
    <Router>
      <Header />
      <Switch>
        <Protected path="/" exact component={Home} />
        <Protected path="/specialities" exact component={Specialities} />
        <Protected path="/specialities/:id" component={Speciality} />
        <Protected path="/courses" exact component={Courses} />
        <Protected path="/courses/:id" component={Course} />
        <Protected path="/teachers" exact component={Teachers} />
        <Protected path="/lessons/:id" component={Fragment} />

        <Public path="/login" exact component={Login} />
        <Public path="/register" exact component={Register} />

        <Route component={Page404} />
      </Switch>
    </Router>
)

export default App;

actionCreators.js：

import Axios from "axios";
import {
  GET_ALL_COURSES,GET_ALL_POSTS,GET_ALL_SPECIALITIES,GET_ALL_TEACHERS,GET_COURSE,GET_FRAGMENT,GET_POST,GET_SPECIALITY
} from "./actions";

const API_URL = process.env.REACT_APP_API_URL

export const getAllPosts = () => dispatch => {
  Axios.get(`${API_URL}/posts`).then(
    resp => {
      return dispatch({
        type: GET_ALL_POSTS,posts: resp.data
      })
    }
  )
}

export const getAllSpecialities = () => dispatch => {
  Axios.get(`${API_URL}/specialities`).then(
    resp => {
      return dispatch({
        type: GET_ALL_SPECIALITIES,specialities: resp.data
      })
    }
  )
}

export const getAllCourses = () => dispatch => {
  Axios.get(`${API_URL}/courses`).then(
    resp => {
      return dispatch({
        type: GET_ALL_COURSES,courses: resp.data
      })
    }
  )
}

export const getAllTeachers = () => dispatch => {
  Axios.get(`${API_URL}/teachers`).then(
    resp => {
      return dispatch({
        type: GET_ALL_TEACHERS,teachers: resp.data
      })
    }
  )
}

export const getPost = id => dispatch => {
  Axios.get(`${API_URL}/posts/${id}`).then(
    resp => {
      return dispatch({
        type: GET_POST,post: resp.data
      })
    }
  )
}

export const getSpeciality = id => dispatch => {
  Axios.get(`${API_URL}/specialities/${id}`).then(
    resp => {
      return dispatch({
        type: GET_SPECIALITY,speciality: resp.data
      })
    }
  )
}

export const getCourse = id => dispatch => {
  Axios.get(`${API_URL}/courses/${id}`).then(
    resp => {
      return dispatch({
        type: GET_COURSE,course: resp.data
      })
    }
  )
}

export const getFragment = id => dispatch => {
  Axios.get(`${API_URL}/lessons/${id}`).then(
    resp => {
      return dispatch({
        type: GET_FRAGMENT,fragment: resp.data
      })
    }
  )
}

reducers.js：

import {
  GET_ALL_COURSES,GET_SPECIALITY
} from "./actions";

export const postReducer = (state = {},action) => {
  if (action.type === GET_ALL_POSTS) {
    return {
      ...state,posts: action.posts
    }
  }

  if (action.type === GET_POST) {
    return {
      ...state,post: action.post
    }
  }
  return state
}

export const specialityReducer = (state = {},action) => {
  if (action.type === GET_ALL_SPECIALITIES) {
    return {
      ...state,specialities: action.specialities
    }
  }

  if (action.type === GET_SPECIALITY) {
    return {
      ...state,speciality: action.speciality
    }
  }
  return state
}

export const courseReducer = (state = {},action) => {
  if (action.type === GET_ALL_COURSES) {
    return {
      ...state,courses: action.courses
    }
  }

  if (action.type === GET_COURSE) {
    return {
      ...state,course: action.course
    }
  }
  return state
}

export const teacherReducer = (state = {},action) => {
  if (action.type === GET_ALL_TEACHERS) {
    return action.teachers
  }
  return state
}

export const fragmentReducer = (state = {},action) => {
  if (action.type === GET_FRAGMENT) {
    return {
      ...state,fragment: action.fragment
    }
  }
  return state
}

这是我的环境变量，称为REACT_APP_API_URL：

REACT_APP_API_URL=http://localhost:8000/api

正如我之前所说，我只是想不出哪里出了问题，在此先感谢你们中任何能帮助我的人。

P.S。对不起，我的英语不好，我是意大利语。

解决方法

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

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

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