Question

所以我有一个reducer，当我调用'LOGIN'操作时，它似乎根本没有更新状态。我的React Redux代码可能有问题。这是因为无论何时商店状态发生更改，我的组件都不会得到重新渲染，或者化简版根本没有更改商店状态。

减速器------

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);

此mapStateToProps返回...

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

何时返回...

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

我已经测试确定是否调用了对减速器的调度，并且有效载荷是正确的。但是，reducer无法使用LOGIN操作类型更新状态。

Answer 1

您能尝试一下吗？

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

React Redux reducer没有更新状态

1 个答案: