Reputation: 550
I'm following this https://react-redux.js.org/api/hooks
I get state undefined, i connected my store or i think i did. i dont know what is the issue. The reducer code is inconsequetial. I'm just trying to return anything to get some kind of helloo world. I have used react redux before.
//index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './js/App';
import * as serviceWorker from './serviceWorker';
import { Provider } from 'react-redux';
import { createStore,} from 'redux';
import reducers from './js/reducers';
const store = createStore(reducers);
ReactDOM.render(
<Provider store={store}>
<React.StrictMode>
<App />
</React.StrictMode>
</Provider>,
document.getElementById('root')
);
//App.js
function App() {
const data = useSelector(state.myReducerData)
return (
<div>{data}</div>
);
}
export default App
//reducers/index.js
import { combineReducers } from 'redux';
import {OneReducer} from "./ExampleReducers"
const rootReducer = combineReducers({
myReducerData: OneReducer
});
export default rootReducer;
//ExampleReducers.js
import {EXAMPLES} from "../actions/types";
export function OneReducer (state = {}, action) {
switch (action.type) {
case EXAMPLES:
return action.payload
default:
return state
}
return state;
}
Upvotes: 0
Views: 70
Reputation: 3589
You're missing reducer initial state for one.
import { EXAMPLES } from "../actions/types";
// declare it here.
const initialState = {
data:[]
};
export function OneReducer(state = initialState, action) {
switch (action.type) {
case EXAMPLES:
return action.payload;
default:
return state;
}
return state;
}
and you can try this
const data = useSelector((state) => state.data) // refers to initial state data property
Upvotes: 1