android - How to render/navigate a component on condition basis -

i have index.android.js getting value of key asyncstorage if value true want navigate dashboardscreen , else stacknav.

index.android.js

/**  * @flow  */  import react, { component } "react"; import { appregistry } "react-native"; import { stacknav } "./router"; export default class scheduledapp extends component {   render() {      const { navigate } = this.props.navigation;      try {       asyncstorage.getitem("@producttour:key").then(value => {         // control goes inside if when user has completed product tour         if (value) {           navigate("dashboardscreen");         }       });     } catch (error) {       console.log(error);     }     return <stacknav />;   } }  appregistry.registercomponent("scheduled", () => scheduledapp); 

router.js

import { stacknavigator } "react-navigation";  import splashscreen "./ui/splashscreen"; import enablenotificationscreen "./ui/enablenotificationscreen"; import createmessagescreen "./ui/createmessagescreen"; import dashboardscreen "./ui/dashboardscreen"; import createsms "./ui/createsms";  export const stacknav = stacknavigator(   {     splash: {       screen: splashscreen,       navigationoptions: {         header: null       }     },     enablenotification: {       screen: enablenotificationscreen,       navigationoptions: {         header: null       }     },     createmessage: {       screen: createmessagescreen,       navigationoptions: {         header: null       }     },     dashboardscreen: {       screen: dashboardscreen,       navigationoptions: {         headerleft: null,         headertitlestyle: { alignself: "center" }       }     },     createsms: {       screen: createsms     }   },   {     initialroutename: "splash"   } ); 

does know how render/navigate component on condition basis ?

export default class scheduledapp extends component {   render() {                 return <stacknav />;   } }  appregistry.registercomponent("scheduled", () => scheduledapp); 

and in splashscreen component:

export default class scheduledapp extends component {   render() {      const { navigate } = this.props.navigation;      try {       asyncstorage.getitem("@producttour:key").then(value => {         // control goes inside if when user has completed product tour         if (value) {           navigate("dashboardscreen");         }       });     } catch (error) {       console.log(error);     }     return <text>return whatever returning in splashscreen render function</text>;   } }