React-native Dispatch action with two tabs at once


I want to re-render two tabs by setParams, it works if i dispatch to one tab, but dispatch to two tabs like code bellow doesn't work

const setParamsAction1 = NavigationActions.setParams({ params: { foo: 'bar' } }, key: 'a' });
const setParamsAction2 = NavigationActions.setParams({ params: { foo: 'bar' } }, key: 'b' });

You need to hook the onNavigationStateChange event to dispatch your second setParams action.

//a navigator for demo
const AppNav = TabNavigator({
    main: {screen: MainScreen},
    a: {screen: aScreen},
    b: {screen: bScreen}

//get the root reference
let appNavRef;

class App extends Component {

    render() {
        return (
            <AppNav ref={navigatorRef => {
                appNavRef = navigatorRef
                        (prevState, currentState) => {
                            //print the state to get more detail
                            // console.log(prevState);
                            // console.log(currentState);
                            //compare the two state: before and after dispatch setParams for "a"
                            //change the if condition for your need
                            let preParams = prevState.routes[1].params;
                            let currentParams = currentState.routes[1].params;
                            if (preParams === undefined && === 'bar') {
                                //dispatch setParams for "b"
                                const setParamsAction = NavigationActions.setParams({
                                    params: currentParams,
                                    key: 'b',

export default App;