Fix the error: Actions must be plain objects. Instead, the actual type was: 'undefined'. You may need to add middleware to your store setup

Question

我的错误信息：

“错误：操作必须是普通对象。相反，实际类型是：'undefined'。您可能需要将中间件添加到商店设置中以处理其他值的调度，例如 'redux-thunk'处理调度函数。有关示例，请参见 https://redux.js.org/tutorials/fundamentals/part-4-store#middleware and https://redux.js.org/tutorials/fundamentals/part-6-async-logic#using-the-redux-thunk-middleware。“

我找到了这个错误的许多答案，但是 none 帮助了我。

我在我的 React 应用程序中存储了一些部分。最后一部分，报错。

我真的很困惑，看了这么多答案，我应该如何创建商店。

我的index.js文件：

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import '../node_modules/video-react/dist/video-react.css'; // import css
import thunk from 'redux-thunk';
import { BrowserRouter } from 'react-router-dom';
import { Provider } from 'react-redux';
import { combineReducers,compose ,applyMiddleware,createStore } from 'redux';
import { file, user,school,student } from "./Utilities/store/reducers";

const combine = combineReducers(
  {
    filePart: file,
    userPart: user,
    schoolPart:school,
    student:student
  }
);




ReactDOM.render(<BrowserRouter>

  <Provider store={createStore(combine, applyMiddleware(thunk))}>

    <App />
  </Provider>
</BrowserRouter>, document.getElementById('root'));

student.js减速器：

import {type} from './../functions/student'
import * as functions from './../functions/student'
const initilize = {
    all: [],
    schools:[],
    courses:[]
};

export const student = (state = initilize, action) => {
    switch (action.type) {
        case type.get: return functions.getCurrent(state);
        case type.fill: return functions.fill(state,action.payload);
    }
    return state;
}

student.js 动作：

import * as functions from './../functions/student'
import { type } from './../functions/student'


export const getCurrent = () => {
    return { type: type.get };
}

export const fill = (post) => {
    return { type: type.fill, payload: post }
}


export const get = (students, teacherId) => {
    if (students && students.all.length > 0) {
        getCurrent();
    }
    if (students === undefined || students.all.length === 0) {
        return async(dispatch) => {
            let result = await functions.get(teacherId);
            dispatch(fill(result));
        }
    }
    else
    getCurrent();
}

调用动作get().

时出现错误

Answer 1

如果 (students === undefined || students.all.length === 0) 不是 true，该方法不会 return 任何东西。但是你 dispatch(get(students, teacherId)) 在某个地方，所以本质上你 dispatch(undefined)

让它总是return一些东西：

export const get = (students, teacherId) => {
  return async(dispatch) => {
    if (students && students.all.length > 0) {
        getCurrent();
    }
    if (students === undefined || students.all.length === 0) {
            let result = await functions.get(teacherId);
            dispatch(fill(result));
        }
    }
  }
}

Fix the error: Actions must be plain objects. Instead, the actual type was: 'undefined'. You may need to add middleware to your store setup

Fix the error: Actions must be plain objects. Instead, the actual type was: 'undefined'. You may need to add middleware to your store setup

store

reactjs

redux

redux-thunk