有人知道为什么会出现这个错误吗?我认为这与thunk中间件有关,我正在使用redux工具包中的configureStore,我只是试图从Axios响应中调度对象数据数组
为什么我总是得到这个错误?我需要添加thunk中间件吗?
这是错误x1c 0d1x
索引.js
import React from 'react';
import ReactDOM from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom';
import { Provider } from 'react-redux';
import { configureStore } from '@reduxjs/toolkit';
import App from './App';
import './index.css'
// slices
import Register from './features/registerSlice'
import loginSlice from './features/loginSlice';
import ForgotSlice from './features/forgot';
import handlePage from './features/heroPage';
import NewTask from './features/newTaskSlice';
import taskList from './features/taskList';
export const store = configureStore({
reducer: {
Register: Register,
Login: loginSlice,
Forgot: ForgotSlice,
handlePage: handlePage,
NewTask: NewTask,
TaskList: taskList
},
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware({
serializableCheck: false,
thunk: true
}),
})
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<BrowserRouter>
<Provider store={store}>
<App />
</Provider>
</BrowserRouter>
);
Private Route//第34行出错,在setList上分派
import React, { useState } from 'react'
import { AnimatePresence } from 'framer-motion'
import { useNavigate } from 'react-router-dom'
import Axios from 'axios'
// COMPONENTS
import Loader from './loader/Loader'
import Hero from './main/hero'
import { useDispatch } from 'react-redux'
import { setList, setFinished } from '../features/taskList'
export const PrivateHome = () => {
Axios.defaults.withCredentials = true
const dispatch = useDispatch()
const navigate = useNavigate()
const [loggedIn, setLog] = useState(false)
const [finished, setFinished] = useState(0)
const [active, setActive] = useState(0)
Axios.get(`${process.env.REACT_APP_BASEURL}/login`).then((response) => {
console.log("TEST LOGIN")
console.log(response)
if (response.data?.loggedIn) {
Axios.get(`${process.env.REACT_APP_BASEURL}/tasks`).then((response) => {
const data = response.data?.userData
setActive(data?.activeTask?.length)
setFinished(data?.finishedTask?.length)
// PUT LIST OF DATA INTO REDUX STATE
dispatch(setList({ value: data?.activeTask })) // ERROR HERE
dispatch(setFinished({ value: data?.finishedTask })) // ERROR HERE
console.log(data)
setLog(true)
})
} else {
setLog(false)
navigate("/", { replace: true })
}
})
if (!loggedIn) {
return (
<AnimatePresence>
<Loader/>
</AnimatePresence>
)
}
return (
<Hero finished={finished} active={active}/>
)
}
1条答案
按热度按时间yyyllmsg1#
编辑:我已经解决了,谢谢!