因此，我试图实现一个东西从API获取数据，但每当我添加<Provider store={store}>到我的网站，它会导致以下错误：

ERROR in ./node_modules/@reduxjs/toolkit/dist/redux-toolkit.esm.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
RangeError: /home/netsu/Documents/Code/HTML-CSS-JS/Webpages/steve-studies/website/client/node_modules/@reduxjs/toolkit/dist/redux-toolkit.esm.js: Maximum call stack size exceeded
    at new TraceMap (/home/netsu/Documents/Code/HTML-CSS-JS/Webpages/steve-studies/website/client/node_modules/@jridgewell/trace-mapping/dist/trace-mapping.umd.js:166:20)
    at /home/netsu/Documents/Code/HTML-CSS-JS/Webpages/steve-studies/website/client/node_modules/@ampproject/remapping/dist/remapping.umd.js:230:26
    at Array.map (<anonymous>)
    at build (/home/netsu/Documents/Code/HTML-CSS-JS/Webpages/steve-studies/website/client/node_modules/@ampproject/remapping/dist/remapping.umd.js:206:42)
    at /home/netsu/Documents/Code/HTML-CSS-JS/Webpages/steve-studies/website/client/node_modules/@ampproject/remapping/dist/remapping.umd.js:230:20
    at Array.map (<anonymous>)
    at build (/home/netsu/Documents/Code/HTML-CSS-JS/Webpages/steve-studies/website/client/node_modules/@ampproject/remapping/dist/remapping.umd.js:206:42)
    at /home/netsu/Documents/Code/HTML-CSS-JS/Webpages/steve-studies/website/client/node_modules/@ampproject/remapping/dist/remapping.umd.js:230:20
    at Array.map (<anonymous>)
    at build (/home/netsu/Documents/Code/HTML-CSS-JS/Webpages/steve-studies/website/client/node_modules/@ampproject/remapping/dist/remapping.umd.js:206:42)
 @ ./src/store.ts 3:0-50 5:14-28
 @ ./src/index.tsx 7:0-28 12:11-16

index.tsx非常简单：

import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import App from './App';
import store from './store';

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

商店也是：

import { configureStore } from '@reduxjs/toolkit';
import rootReducer from './reducers';

const store = configureStore({
  reducer: rootReducer,
});

if (process.env.NODE_ENV === 'development' && module.hot) {
  module.hot.accept('./reducers', () => {
    store.replaceReducer(rootReducer);
  });
}

export default store;

和还原剂：

import { combineReducers } from 'redux';
import coursesSlice from './views/courses/slice';

const rootReducer = combineReducers({
  courses: coursesSlice,
});

export default rootReducer;

起初我以为错误可能源于slices. ts文件，但现在不那么肯定了：

import { createSlice } from '@reduxjs/toolkit';
import { getCourses } from '../../api/courses';

const initialState = {
  loadingStatus: 'NOT_STARTED',
  courses: [],
  error: ""
};

const coursesSlice = createSlice({
  name: 'courses',
  initialState,
  reducers: {
    getCoursesStarted(state) {
      state.loadingStatus = 'PENDING';
    },
    getCoursesSuccess(state, action) {
      const courses = action.payload;
      state.courses = courses;
      state.loadingStatus = 'COMPLETE';
    },
    getCoursesFailed(state) {
      state.loadingStatus = 'COMPLETE';
      state.error = 'Could not get courses';
    },
  },
});

export const {
  getCoursesStarted,
  getCoursesSuccess,
  getCoursesFailed,
} = coursesSlice.actions;

export default coursesSlice.reducer;

export const fetchCourses = () => async (dispatch: any) => {
  try {
    dispatch(getCoursesStarted());
    const courses = await getCourses();
    dispatch(getCoursesSuccess(courses));
  } catch (err: any) {
    dispatch(getCoursesFailed());
  }
};

这个App.tsx是这样的，但是，即使我删除了所有的东西，除了return，它仍然会抛出错误，所以它不是来自这个：

import React, { useEffect } from 'react';
import { fetchCourses } from './views/courses/slice';
import { RootStateOrAny, useDispatch, useSelector } from 'react-redux';

const App: React.FC = () => {
  const dispatch = useDispatch();

  const courses = useSelector<RootStateOrAny, {
    loadingStatus: string,
    courses: any,
    error: string
  }>((state) => state);

  useEffect(() => {
    if(courses.loadingStatus === "NOT_STARTED"){
      dispatch(fetchCourses)
    }
  }, [dispatch, courses.loadingStatus])

  return (
    <div>
      <h1>Users</h1>
    </div>
  )
}

export default App;

我已经搜索了又搜索，但没有找到答案...为什么会发生这种情况，我知道这是因为一个递归函数，从我所读到的，但我不明白为什么它是造成...

• 操作系统：Arch Linux
• 类型脚本：4.5.5
• 节点编号：16.13.2