如何在注销时重置redux存储?
我试图在注销时重置存储,但它似乎根本不起作用 正如您所看到的,我正在使用AsyncStorage作为我的存储,我尝试按照帖子中的答案进行操作 这是我在商店文件夹中的index.js如何在注销时重置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
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
}
};