ReactNavigation how to achieve page jump

First, how to achieve page jump ReactNavigation

  Because each screen components (components with routing address) are all App root component is automatically created and mounted, App components when creating a screen set up, will be automatically passed in a props: navigation

  Jump from the current screen to other screens:

this.props.navigation.navigate ( 'screen address')

  Note: By default, Image no onPress event, if you want to achieve the jump is clicked, the package needs to "touch feedback components", such as

<TouchableOpacity onPress={}> 

<Image/>

</TouchableOpacity>

 

3.ReactNavigation how to achieve mass participation Jump

  Memories: Web browser-based application how mass participation?

    Angular in:  

Routing dictionary: {path: 'product / detail /: pid', component: ...}

     Execution jumps: <a routerLink="product/details/15">

  Note: RN application no browser, no address bar, no / 15!

  RN transmit routing parameters need to modify routing dictionary;

  Provides routing parameters before a jump component:

this.props.navigation.navigate ( 'destination address', {pid: 13, age: 30})

  After reading a complete routing parameters when loading component:

this.props.navigation.state.params   ——  {pid:13, age:30}

     or

     this.props.navigation.getParam ( 'pid', 99) // 99 indicates the default parameter values

Guess you like

Origin www.cnblogs.com/sna-ling/p/12369956.html