如何从 redux 持久存储（localstorage）中读取答案

【问题标题】：How to read from redux persisted store (localstorage)如何从 redux 持久存储（localstorage）中读取
【发布时间】：2020-02-22 19:48:32
【问题描述】：

我有一个这样的 redux 持久化配置：

const persistConfig = {
    key: 'persistedStore',
    storage: storage,
    transforms: [expireIn(expireTime, expirationKey, []), encryptor],
    whitelist: ['reducer1','reducer2','reducer3', 'reducer4']
};

所以 localStorage 键类似于“persist:persistedStore”。

我试过这样读取存储： let user = localStorage.getItem('persist:persistedStore')，这给了我一些回报，但是当我做类似的事情时：user.reducer1，总是返回未定义。 console.log(localStorage.getItem('persist:persistedStore')，返回以下内容：来自存储的数据：

{"reducer1":"\"U2FsdGVkX1/PRA7nYWyo2/SVOlbMXs0z50XKvWmhxhUDW+DaQ9FU9jIRnVTSLpwzpS5NCWC+xX3V2TWBNGFzUA==\"","reducer3":"\"U2FsdGVkX183kEvgTl8/hC450C9iyVJh++m2ptQlqbFBskhU2B5l43Hyf2azCeF7xe4KcDqzXoO6Zhe7qQV8aaX+tOpPqQrzhS9hjsD8n1Gkbx5c/g0LfzBXnv+zh88ztZBERj5/p51uEmn/yI5TBvdBdtSoeQNTylFTlkIBJSVJtjovl5uNN3Iqc6Pj0WOJTNMnJaQsT/WjWiuODz2fIXgWpiny4Rj3Fek10m/3RVAn45pPrKlZoTFot8ih5oyz8v0oUBPbOcsa+sxfRTaM0AL7Lxud1mr3KFt5gy/9GDGTxukLfI0Z9jsaLH+0p1wicgUZO0pUgPuiF5KfU+WGLxxCbDheFwFU71j/welwyTvG1k6Jjbrq5/SIV2Oh1hQJlZ5G+ODRRwHyPPh07eq5kntUFwfGhxY+xVqB0EYh04+K5nqoauaQVZeRPHlvt7djiuh61BlycyINWBBYugpzES2UEbT2Q7Dtt65087+ST6/KbAEnTsOaJ+xy1GdyYNobE5XkcUXnF+vfv+Bn/6V9+1wHpnVYTGPBWIJ6xlN+6s4tkNp+nC7bGQ6r8G8boUnqA9ANQHX4w2S+jr7ysTa5udmQ1Ch7YC/Efb++ywdIUWs7tqZpeSngRzwTQ/jtzPcAoKD4zjEWZNCyyjAXa1P/rpv++KcnWyHbw7VfSBd0BXo=\"","reducer2":"\"U2FsdGVkX19nPr02OWgj71q600tUk0PU5hYZVm7G+pAcByNvztMt7C9BqFLCYyOBLzfi0l/UdPntltGPoKEKpguIis2chKHPyX0c2c7owNQ=\""

【问题讨论】：

标签： javascript reactjs redux redux-persist

【解决方案1】：

由于localStorage 将数据保存在字符串中，因此您需要在存储 JSON 之前对其进行字符串化，然后在检索时对其进行解析。

// storage
const storage = { "reducer1": { "someKey": "Some Data" } }
localStorage.setItem('persistedStore', JSON.stringify(storage))
// retrieval
const retrievedStoreStr = localStorage.getItem('persistedStore') // this is a string
const retrievedStore = JSON.parse(retrievedStoreStr) // this will be a JSON object
const reducer1 = retrievedStore.reducer1 // should now have your reducer

【讨论】：

我可以有类似的东西： const persistConfig = { key: 'persistedStore', storage: JSON.stringify(storage), // 这就是存储的设置方式。转换：[expireIn(expireTime, expirationKey, []), encryptor]，白名单：['reducer1','reducer2','reducer3', 'reducer4'] };
绝对！只要persistConfig 中的数据计算为字符串原语，就可以将其保存在localStorage 中。 :)