Bagaimana untuk Tetapkan Semula Keadaan Kedai Redux semasa Log Keluar Pengguna?

Menetapkan semula Redux Store State untuk Pengurusan Sesi Pengguna

Redux menyediakan rangka kerja yang teguh untuk pengurusan keadaan dalam aplikasi. Untuk memastikan integriti data, mungkin perlu menetapkan semula stor kepada keadaan asalnya apabila pengguna log keluar. Ini menghalang data yang dikaitkan dengan pengguna sebelumnya daripada dicache dan berpotensi menjejaskan pengalaman pengguna seterusnya.

Pengurang Akar Tersuai

Satu pendekatan untuk menetapkan semula stor adalah dengan cipta pengurang akar tersuai yang mewakilkan pengendalian kepada pengurang individu. Walau bagaimanapun, ia mengatasi gelagat lalai untuk tindakan USER_LOGOUT dan mengembalikan keadaan awal.

const appReducer = combineReducers({
  /* your app’s top-level reducers */
})

const rootReducer = (state, action) => {
  if (action.type === 'USER_LOGOUT') {
    return appReducer(undefined, action)
  }

  return appReducer(state, action)
}

Pembersihan Storan dengan Redux-Persist

Jika menggunakan redux-persist, langkah tambahan diperlukan untuk mengosongkan keadaan cache daripada storan. Ini melibatkan mengimport enjin storan yang sesuai dan menghuraikan keadaan sebelum menetapkannya kepada tidak ditentukan, kemudian mengosongkan setiap kunci keadaan storan.

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

        return appReducer(undefined, action);
    }
    return appReducer(state, action);
};

Dengan melaksanakan strategi ini, anda boleh menetapkan semula stor Redux dengan berkesan kepada keadaan asalnya apabila pengguna log keluar, memastikan integriti data dan pengalaman pengguna yang lancar untuk pengguna seterusnya.

Atas ialah kandungan terperinci Bagaimana untuk Tetapkan Semula Keadaan Kedai Redux semasa Log Keluar Pengguna?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!