This is the Redux code:
import { configureStore, createSlice } from "@reduxjs/toolkit";
let initialState = {
name: "",
password: "",
};
const loginReducer = createSlice({
name: "login",
initialState: initialState,
reducers: {
nameChanger(state, action) {
state.name = action.payload;
},
passwordChanger(state, action) {
state.password = action.payload;
},
},
});
const store = configureStore({
reducer: { login: loginReducer.reducer },
});
export const loginAction = loginReducer.actions;
export default store;
The App.js:
import './App.css';
import HomePage from './pages/HomePage';
import Login from './pages/Login';
import store from './redux/Redux-store';
import { Provider } from 'react-redux';
import { RouterProvider, createBrowserRouter } from 'react-router-dom';
function App() {
const router = createBrowserRouter([
{
path: "/",
element: <HomePage />,
},
{
path: '/login',
element: <Login />,
}
]);
return (
<Provider store={store}>
<RouterProvider router={router} />
</Provider>
);
}
export default App;
When I try to run the above code it returns caught TypeError: store.getState is not a function
.
I have read many articles regarding this topic but none of them solved my problem.
What is the problem and how can I fix it?
2
Answers
You should wrap in index.js file
eg: