Redux/Reducer - dispatching doesnt change state

Question

As the title says, i dispatch an action but my state doesnt change. Here's some code:

App.js

import { createStore } from 'redux'
import reducer from './../reducer/reducer'
import { TEST } from './../reducer/actions'

// Initial store 
const initialStore = {
    name: "John",
    count: 0
};

const store = createStore(reducer, initialStore);
store.dispatch({ type: TEST })
console.log(store.name);

Reducer.js

import { GET_ITEMS, ADD_ITEM, TEST } from './actions'

function reducer (state, action)  {
    console.log(state, action);
    
    if(action.type === TEST){
        console.log("TEST");
        return {...state, name: "Mark"};
    }

    return state;
}

export default reducer;

package.json

"react-redux": "^7.2.2",
"redux": "^4.0.5",

• console.log('TEST) from reducer.js prints 'TEST' but state name stays the same.
• console.log(store.name) from app.js prints undefined

Any ideas why this doesnt work?

Answer 1

You should use store.getState() to access the current state. store.getState().name should return the name. Since store doesn't have a name property, undefined is returned.

store.dispatch({ type: TEST })
console.log(store.getState().name)