React-native-navigation: how to use redux-persist

[guopeng1994]

Issue Description

now, in my project,there are react-native ,redux, redux-thunk,and i want to import redux-persist to my project, i followed the redux-persist doc, in the end, i dont know hot to use persistor(let store = createStore(reducer) ; let persistor = persistStore(store) ) in react-native-navigation. i found that registerComponent function have 'store' and 'Provider' args, but don't know how to user persister. i searched a lot,but nothing suggestions found. please help me.thank you guys a lot.

Environment

• React Native Navigation version: 1.1.297
• React Native version: 0.47.0
• "react-redux": "5.0.6",
• "redux": "3.7.2",
• "redux-persist": "5.4.0",
• "redux-thunk": "2.2.0"

[NicholasBertazzonAga]

Same situation, I passed the persistor via "passProps" in the startSingleScreenApp.
Example:
Navigation.startSingleScreenApp({
...
passProps: {my_persistor: persistor}
...
});

Then I use it in my splashscreen or where you want to use it.

[gperdomor]

@NichAga can you provide an example please? or link to a repository?

[Tzinov15]

Would love to see an example of how you did this as well @NichAga. I'm trying to accomplish the same thing

[NicholasBertazzonAga]

@gperdomor @Tzinov15

In my index.js i do this.

registerScreens(Store.store, Provider);

Navigation.startSingleScreenApp({
    screen: {
        screen: my.first.screen
    },
    drawer: {
        left: {
            screen: 'my.drawer'
        },
        disableOpenGesture: Platform.OS === "ios"
    },
    appStyle: {
        orientation: 'portrait'
    },
    animationType: 'fade',
    passProps: {persistore: Store.persistor}
});

And then, in "my.first.screen", i use the persistgate. It's working well.

[guyca]

Please continue discussion in Stack Overflow.
Since we don't use redux persist, we can't assist you with this issue. Would be nice if someone could add a guide to the docs once you figure this out.
Thanks

[FinnGu]

Found this thread on SO helpful and added it to the documentation(#2472) :)

[efstathiosntonas]

@FinnGu can you share your App.js file? I'm having trouble setting it up.

edit: i found a sample: https://github.com/tonec/currency/blob/f64ccbf6c12ab9a851bfb9ec887e98408921ec8b/src/app.ios.js

[FinnGu]

@efstathiosntonas Sure, hope it helps :)

```import { Platform } from 'react-native';
import { Navigation } from 'react-native-navigation';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware, combineReducers, compose } from 'redux';
import { persistStore, persistCombineReducers } from 'redux-persist';
import storage from 'redux-persist/es/storage';
import thunkMiddleware from 'redux-thunk';
import { createLogger } from 'redux-logger';
import { registerScreens } from './screens';
import reducer from './reducers';

const loggerMiddleware = createLogger({ predicate: (getState, action) => __DEV__ });

const persistConfig = {
key: 'root',
storage,
}

const combinedReducer = persistCombineReducers(persistConfig, reducer)

function configureStore(initialState) {
const enhancer = compose(
applyMiddleware(
thunkMiddleware,
loggerMiddleware,
),
);

return createStore(combinedReducer, initialState, enhancer);
}

const store = configureStore({});

persistStore(store, null, () => {
registerScreens(store, Provider)

Navigation.startSingleScreenApp({
screen: {
screen: 'MyApp.Screens.Main',
title: 'Welcome',
},
appStyle: {
orientation: 'portrait',
},
});
})