從使用 combineReducers 的 Redux 的主 state 中刪除特定屬性的正確方法 - 反應 Redux

Question

我有一個應用程序，我想在其中實施授權（注冊、登錄、注銷）。 為此，我必須使用 redux。 到目前為止，注冊和登錄效果很好，但是當我應該在用戶單擊注銷按鈕時刪除已登錄用戶的數據時，我遇到了問題。

我試圖將登錄和注銷案例放在同一個減速器中，但是當用戶登錄時，我無法訪問用戶的數據，而不是只獲取舊用戶數據 object 並返回空的，它只是添加了一個將 object 清空到用戶的數據。

我的 redux state 登錄前：

我的 redux state 登錄后：

注銷后我的 redux state

這是我的登錄和注銷操作：

export function userLoginSuccess(user) {
    return {
        type: 'USER_LOGIN_SUCCESS',
        user
    }
}

export function userLogout() {
    return {
        type: 'USER_LOGOUT'
    }
}

這是減速器：

export function userLogin(state = {}, action) {
    switch (action.type) {
        case 'USER_LOGIN_SUCCESS':
            localStorage.setItem('userToken', action.user.token);
            return action.user;
        case 'USER_LOGOUT':
            localStorage.removeItem('userToken');
            return {
                ...state,
                userLogin: {}
            }
        default:
            return state;
    }
}

這是使用combineReducers的存儲初始化：

import { userLogin, companies, dataHaveError, dataIsLoading } from './redux/reducers';

const rootReducer = combineReducers({
  companies,
  userLogin,
  dataHaveError,
  dataIsLoading
})

const enhancer = applyMiddleware(thunk);

const store = createStore(rootReducer, {}, composeWithDevTools(enhancer));

我試圖找到一個解決方案，但我發現的只是沒有combineReducers並且他們使用 initialState 來解決這類問題，但在這種情況下，我的理解是， combineReducers正在為每個減速器創建一個 state 屬性，所以我沒有不知道如何處理這個特殊問題。

Answer 1

export function userLogin(state = {}, action) {
    switch (action.type) {
        case 'USER_LOGIN_SUCCESS':
            localStorage.setItem('userToken', action.user.token);
            return action.user;
        case 'USER_LOGOUT':
            localStorage.removeItem('userToken');
            return {} // return empty state
        default:
            return state;
    }
}