title: Dispatch action to redux from react-native-router-flux event
body: <p>I'm using <code>react-native-router-flux</code> and I don't know how to dispatch a redux action from within the toolbar actions, depending on the state when the user selects an action from the Toolbar, for example if the user is logged in and it presses the user button in the toolbar it should navigate to his profile, otherwise it should navigate to the login screen.</p>
  
  <p>This is what I've tried, and it works, but it slows the application dramatically (it's not longer usable), if you take a look at the code, what's doing is initializing a "global" function and setting it to the redux store, so I can dispatch actions using it.</p>
  
  <pre><code>'use strict'
  import { Router, Scene, Actions } from 'react-native-router-flux';
  //redux
  import { bindActionCreators } from 'redux';
  import { connect } from 'react-redux';
  import * as actionCreators from '../redux/actions-creators/actions';
  function mapStateToProps(state) {
    return {
      //...
    }
  }
  function mapDispatchToProps(dispatch) {
    return bindActionCreators(actionCreators, dispatch);
  }
  const scenes = Actions.create(
    &lt;Scene
      key="root"
      onRight={() =&gt; {
                 Actions.profile({});
               }}&gt;
      &lt;Scene
        key="home"
        component={Home}
        title="Home"
        initial={true} /&gt;
      &lt;Scene
        key="login"
        component={LoginScreen}
        title="Login" /&gt;
      &lt;Scene
        key="editProfile"
        component={EditProfile}
        title="EditProfile"
        onRight={() =&gt; {
                   Actions.home({}); // this works
                   _logout(); // this is what i need to do, 
                   // it calls the function below,
                   // dispatch is not available here, this gets compiled 
                   // before the app runs
                   // this.props.logout(); // this is what i need
                 }} /&gt;
    &lt;/Scene&gt;
  );
  var logoutAction = () =&gt; {}; // gets assigned to the redux logout action
  function _logout() {
    logoutAction(); // calls the redux logout action
  }
  class AppNavigator extends React.Component {
    constructor(props) {
      super(props);
    }
    componentDidMount() {
      logoutAction = this.props.logout; // this "hack" breaks performance
      BackAndroid.addEventListener('hardwareBackPress', function() {
        Actions.pop({});
        return true;
      });
    }
    render() {
      return &lt;Router scenes={scenes} /&gt;
    }
  }
  const MainNavigator = connect(mapStateToProps, mapDispatchToProps)(AppNavigator);
  export default MainNavigator;
  </code></pre>
  
  <p>I need to find the right way to do this, as in dispatch actions form the <code>onRight={() =&gt; { ...here... });</code> method in the Scene</p>
  
  <p>Another thing I tried was to put the Scene definitions inside the render() method, but the app runs much slower, this method of defining the definitions outside makes the app run much faster, but it won't allow me to call this.props, because this is undefined.</p>