如何在注销时重置redux存储?

如何在注销时重置redux存储?,redux,react-redux,Redux,React Redux,我试图在注销时重置存储,但它似乎根本不起作用 正如您所看到的,我正在使用AsyncStorage作为我的存储,我尝试按照帖子中的答案进行操作 这是我在商店文件夹中的index.js import thunk from 'redux-thunk'; import { createStore, compose, applyMiddleware } from 'redux'; import { AsyncStorage } from 'react-native'; import { persistSt

我试图在注销时重置存储,但它似乎根本不起作用

正如您所看到的,我正在使用AsyncStorage作为我的存储,我尝试按照帖子中的答案进行操作

这是我在商店文件夹中的index.js

import thunk from 'redux-thunk';
import { createStore, compose, applyMiddleware } from 'redux';
import { AsyncStorage } from 'react-native';
import { persistStore, autoRehydrate } from 'redux-persist';
import rootReducer from '../reducers';

var defaultState = {};

export function configureStore(initialState = defaultState) {
  var store = createStore(rootReducer, initialState, compose(
    applyMiddleware(thunk),
    autoRehydrate(),
  ));
  persistStore(store, { storage: AsyncStorage });
  return store;
}
这是我在reducers文件夹中的index.js

import { combineReducers } from 'redux';
import { reducer as formReducer } from 'redux-form';
import { AsyncStorage } from 'react-native';

import authReducer from './authReducer';
import alertsReducer from './alertsReducer';
import jobsReducer from './jobsReducer';
import userDataReducer from './userDataReducer';

const appReducer = combineReducers({
  form: formReducer,
  auth: authReducer,
  alerts: alertsReducer,
  jobs: jobsReducer,
  userData: userDataReducer
})

const rootReducer = ( state, action ) => {
  if(action.type === 'UNAUTH_USER') {
    Object.keys(state).forEach(key => {
      AsyncStorage.removeItem(`persist:${key}`);
      console.log(state)
    });
  }
  return appReducer(state, action)
}

export default rootReducer

在我们应用的初始载荷上,减速器状态为新鲜

我们可以复制这个初始默认状态,并在注销时使用它再次分配给我们的reducer,我们可以通过以下方式实现这一点

步骤1:对应用程序加载调用一个操作,该操作将把reducer的初始状态复制为defaultState

function* logoutUser(action) {
  // on logout success 
  dispatch("RESET_STATE")
}
步骤2:在注销应用程序时,我们可以简单地重新分配默认状态,它应该作为新的工作

应用程序根组件

  componentDidMount() {   
    dispatch(ON_APP_LOAD)
  }
应用程序减速器

const appReducer = combineReducers({
  user: userStatusReducer,     
  analysis: analysisReducer,
  incentives: incentivesReducer
});

let defaultState = null;
export default (state, action) => {
  switch (action.type) {
    case **ON_APP_LOAD**:
      // will be assigned or called only once 
      defaultState = defaultState || state;
      break;
    case **RESET_STATE**:
      // detaching the reference on reset
      state = _.deepClone(defaultState);
      return state;
    default:
      break;
  }
  return appReducer(state, action);
};
注销时调用重置状态的操作

function* logoutUser(action) {
  // on logout success 
  dispatch("RESET_STATE")
}

我假设您有一个js文件,其中所有还原程序都合并在一个文件中,因此您有:

const allReducers = combineReducers({
   reducer: nameOfReducer
});

const rootReducer = (state, action) => {

    switch (action.type) {
        case  CLEAR_ALL_REDUCERS_DATA:
            return state = undefined;
        default:
            return allReducers(state, action)
    }
};

export default rootReducer;
在索引文件中创建一个需要定义的存储

const store = createStore(rootReducer,
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
);
然后只需在注销时调用它:

dispatch(clearAllStoreData());
其中clearAllStoreData是在操作文件中定义的操作:

export const clearAllStoreData = () => {
    return {
        type: CLEAR_ALL_REDUCERS_DATA
    }
};