I am getting the error :'TypeError: store.getState is not a function' and I can't determine where the problem is
here's how I created the store:
import { applyMiddleware, createStore } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './rootReducer';
const initialState = {
pending: false,
products: [],
error: null
}
const middlewares = [thunk];
export const store=createStore(rootReducer, initialState, applyMiddleware(...middlewares));
and here's the index.js:
import React from "react";
import ReactDOM from "react-dom";
import { Provider } from "react-redux";
import store from './App'
import App from "./App";
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById("root")
);
and here's the thunk function:
function fetchProducts() {
return dispatch => {
dispatch(fetchProductsPending());
fetch('https://api.spacexdata.com/v3/launches')
.then(res => res.json()
)
.then(
res => {
if(res.error) {
throw(res.error);
}
dispatch(fetchProductsSuccess(res.products));
return res.products;
})
.catch(error => {
dispatch(fetchProductsError(error));
})
}
}
export default fetchProducts;
and here's a sandbox of the problem:
https://codesandbox.io/s/polished-sunset-wxefc?file=/src/index.js
here's a screenshot of the error:
The store
is not the default
export from the ./App.jsx
module. You either need to add curly braces to your import or export store
as the default
:
// App.jsx
export const store = /* ... */
// index.js
import { store } from './App';
or
// App.jsx
export default const store = /* ... */
// index.js
import store from './App';
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments