Question

我在使用redux-persist启动应用后，无法访问已保存的数据。

reducer使用我初始状态中定义的数据进行初始化。当前一个会话的状态加载AsyncStorage时，该组件已经显示了默认数据。

我知道数据已成功保存和获取。如果我将屏幕留给另一个并回到它，我可以看到数据显示正确。调试状态和道具也表明这是一个异步计时问题。

如何在商店补充水分后延迟加载redux容器。或者，我可以强制更新conatainer（及其子代）以在商店完成加载时更新吗？

这是我尝试过的。配置我的商店：

export default function configureStore(initialState) {
    const middlewares = [thunk];
    if (process.env.NODE_ENV === `development`) {
        const createLogger = require(`redux-logger`);
        const logger = createLogger();
        middlewares.push(logger);
    }

    let store = compose(
        applyMiddleware(...middlewares),
        autoRehydrate() )(createStore)(reducers);

        persistStore(store, {blacklist: ['routing'], storage: AsyncStorage}, () => {
            store.dispatch(storeRehydrateComplete())
        })


    return store
}

希望这会更新所有其他组件（因为redux中的所有reducer都在一个动作中被调用），我尝试创建一个在商店完成加载时触发的动作：

import { REHYDRATE_STORE } from './types'

export function storeRehydrateComplete(){
    return {
        type: REHYDRATE_STORE,
    }
}

它的减速机：从＆＃39; ../ actions / types＆＃39;导入{REHYDRATE_STORE} const initialState = { storeIsReady：false }

export default function reducer(state = initialState, action){
    switch (action.type) {
        case REHYDRATE_STORE:
            return {...state, storeIsReady:true}
            break;
        default:
            return state
            break;
    }
}

但是，虽然在补液完成后storeIsReady状态变为true，但我仍然无法弄清楚如何强制更新容器组件。

Answer 1

我按照这个食谱解决了这个问题： delay-render-until-rehydration-complete

基本上解决方案如下：
在包装<Provider>的组件中，创建一个本地状态标志，用于跟踪商店是否已经重新水化。使用persistStore（）的回调来更新此标志。在此包装器的render函数中，如果该标志为true，则呈现#!/bin/bash getArray() { array=() while IFS= read -r line do array+=("$line") done < "$1" } getArray "dan.txt" for e in "${array[@]}" do mv "$e" /root/moved done，否则，呈现一些临时视图。

在存储使用redux-persist重新水合之前加载初始状态的默认值

1 个答案: