artSir
artSir

Reputation: 550

React Redux Hooks not finding State

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

Answers (1)

BARNOWL
BARNOWL

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

Related Questions