2017-06-15 31 views
1

redux-persistライブラリのgetStoredStateを正しく使用しているかどうかわかりません。私は、デフォルトのreduxストアとして保持されているストアを使用したいと思います。redux-persistで正しくgetStoredStateを使用する方法

のconfig/store.js

async function getState() { 
    const storedState = await getStoredState({ storage: AsyncStorage }); 

    const store = createStore(reducers, storedState, compose(
    applyMiddleware(logger), 
    autoRehydrate() 
)); 
    persistStore(store, {storage: AsyncStorage); 
} 

export default getState(); 

App.js

import store from 'config/store'; 
import { Provider } from 'react-redux'; 

export default() => (
    <Provider store={store}> 
    // 
    </Provider> 
) 

これは、次の警告生成:

Warning: Failed child context type: The child context `store.subscribe` is marked as required in `Provider`, but its value is `undefined`. 

Warning: Failed prop type: The prop `store.subscribe` is marked as required in `Provider`, but its value is `undefined` 

任意のアイデアこれらの警告を引き起こしている何を?私はstore.jsで何か間違ったことをした気がします。

答えて

0

プロバイダがインスタンス化しようとすると、ストア変数がまだ保留中です。getStoreStateメソッドはPromiseを返します。ストアの使用は完了します。

この例では、サンプル実装を示しています

import {getStoredState, createPersistor} from 'redux-persist' 

class App extends Component { 

    constructor(props) { 
    super(props) 
    this.store = null 
    this.persistor = null 
    } 

    componentWillMount(){ 
    const persistConfig = {storage: AsyncStorage} 
    getStoredState(persistConfig, (err, restoredState) => { 
     this.store = createStore(
     reducers, 
     restoredState, 
     compose(
      applyMiddleware(logger,) 
     ) 
    ) 
     this.persistor = createPersistor(this.store, persistConfig) 
     // Now that we have the store setted, reload the component 
     this.forceUpdate() 
    }) 
    } 

    render() { 
    if (!this.store) { 
     // Loading screen 
     return <Text>Loading</Text> 
    } else { 
     return (
      <Provider store={this.store}> 
      <Router /> 
      </Provider> 
    ) 
    } 

    } 
} 

どれ改善のヒントは歓迎されています。

関連する問題