ऐसा करने का एक तरीका यह होगा कि आप अपने आवेदन में एक रूट रिड्यूसर लिखें।
रूट reducer आमतौर पर उत्पन्न reducer के लिए कार्रवाई से निपटने प्रतिनिधि होगा combineReducers()
। हालाँकि, जब भी यह प्राप्त होता हैUSER_LOGOUT
कार्रवाई है, यह प्रारंभिक अवस्था को फिर से लौटा देता है।
उदाहरण के लिए, यदि आपका रूट reducer इस तरह दिखता है:
const rootReducer = combineReducers({
/* your app’s top-level reducers */
})
आप इसका नाम बदलकर appReducer
नया rootReducer
प्रतिनिधि लिख सकते हैं:
const appReducer = combineReducers({
/* your app’s top-level reducers */
})
const rootReducer = (state, action) => {
return appReducer(state, action)
}
अब हमें कार्रवाई के rootReducer
बाद प्रारंभिक अवस्था में लौटने के लिए नए को सिखाने की जरूरत है USER_LOGOUT
। जैसा कि हम जानते हैं, रिड्यूसर प्रारंभिक स्थिति को वापस करने वाले होते हैं, जब उन्हें undefined
पहले तर्क के रूप में बुलाया जाता है, कोई फर्क नहीं पड़ता। इस तथ्य का उपयोग सशर्त state
रूप से संचित करने के लिए करते हैं क्योंकि हम इसे पास करते हैं appReducer
:
const rootReducer = (state, action) => {
if (action.type === 'USER_LOGOUT') {
state = undefined
}
return appReducer(state, action)
}
अब, जब भी USER_LOGOUT
आग लगती है, सभी reducers को नए सिरे से शुरू किया जाएगा। वे शुरू में किए गए काम से कुछ अलग कर सकते हैं यदि वे चाहते हैं क्योंकि वे भी जाँच कर सकते हैं action.type
।
दोबारा दोहराने के लिए, पूरा नया कोड इस तरह दिखता है:
const appReducer = combineReducers({
/* your app’s top-level reducers */
})
const rootReducer = (state, action) => {
if (action.type === 'USER_LOGOUT') {
state = undefined
}
return appReducer(state, action)
}
ध्यान दें कि मैं यहां राज्य को उत्परिवर्तित नहीं कर रहा हूं, मैं केवल एक स्थानीय चर के संदर्भ को पुन: असाइन कर रहा हूं जिसे कहा जाता हैstate
किसी अन्य फ़ंक्शन में पास करने से पहले । राज्य वस्तु को म्यूट करना Redux सिद्धांतों का उल्लंघन होगा।
यदि आप Redux-persist का उपयोग कर रहे हैं , तो आपको अपने भंडारण को साफ करने की भी आवश्यकता हो सकती है। Redux-persist आपके राज्य की एक प्रति एक भंडारण इंजन में रखता है, और राज्य की प्रति वहां से ताज़ा करने पर लोड की जाएगी।
सबसे पहले, आपको उचित भंडारण इंजन आयात करने की आवश्यकता है और फिर, इसे undefined
स्टोर करने के लिए राज्य को पार्स करने के लिए और प्रत्येक भंडारण राज्य कुंजी को साफ करने के लिए ।
const rootReducer = (state, action) => {
if (action.type === SIGNOUT_REQUEST) {
// for all keys defined in your persistConfig(s)
storage.removeItem('persist:root')
// storage.removeItem('persist:otherKey')
state = undefined;
}
return appReducer(state, action);
};