反应 Redux 减速器不更新 State

Question

So I have a reducer which doesn't seem to be updating the state at all whenever I called the 'LOGIN' action. It could be a problem with my React Redux code. It's either my component is not getting re rendered whenever the store's state changes or the reducer is not changing the stores state at all.

Reducer ------

const initialState = {
    messages: [],
    loginDetails: {
        email: '',
        password: ''
    },
    activeUsers: [],
    loginActive: false
}

const messageReducer = (state = initialState, action) => {
    switch(action.type) {
        case 'ADD_MESSAGE': 
            if(state.messages.length < 50) {
                let newStateMessages = [...state.messages]
                newStateMessages.unshift(action.payload);
                console.log(newStateMessages);
                return {...state, messages: newStateMessages};
            } else {
                let newStateMessages = [...state.messages]
                newStateMessages.pop();
                newStateMessages.unshift(action.payload);
                return {...state, newStateMessages};
            }
        case 'LOGIN':
            console.log('LOGIN');
            console.log(action);
            const newLoginDetails = {
                email: action.payload.email,
                password: action.payload.password
            };
            console.log({...state, loginDetails: newLoginDetails});
            return {...state, loginDetails: newLoginDetails};
        case 'UPDATE_USERS':
            const newActiveUsers = action.payload;
            return {...state, activeUsers: newActiveUsers};
        case 'LOGIN_ACTIVE':
            return {...state, loginActive: true};
        case 'LOGIN_EXIT':
            return {...state, loginActive: false};
        default:
            return state;
    }
}

export const store = createStore(messageReducer);

React Redux connect -----

    const mapStateToProps = state => {
      return { ...state }
    }

    export default connect(mapStateToProps)(Home);

This mapStateToProps returns...

{
   activeUsers: []
   dispatch: ƒ dispatch(action)
   loginActive: true
   loginDetails: {email: "", password: ""}
   messages: []
   __proto__: Object
}

when it should return...

{
   activeUsers: []
   loginActive: true
   loginDetails: {email: "example@gmail.com", password: 
   "password"}
   messages: []
   __proto__: Object
}

I have tested for sure that the dispatch to the reducer is getting called, and the payload is correct. However, the reducer is failing to update the state with the LOGIN action type.

Answer 1

Can you try this:

const mapStateToProps = ({activeUsers,loginActive,loginDetails,messages}) => ({
   activeUsers,
   loginActive,
   loginDetails,
   messages
})