mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Updated docs for next
This commit is contained in:
1 parent
4cbcc23006
commit
d7043ada97
1 file changed
+123
-42
@@ -1,48 +1,129 @@
|
||||
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>Navigator – React Native | A framework for building native apps using React</title><meta name="viewport" content="width=device-width"><meta property="og:title" content="Navigator – React Native | A framework for building native apps using React"><meta property="og:type" content="website"><meta property="og:url" content="http://facebook.github.io/react-native/index.html"><meta property="og:image" content="http://facebook.github.io/react-native/img/opengraph.png?2"><meta property="og:description" content="A framework for building native apps using React"><base href="/react-native/releases/next/"><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"><link rel="shortcut icon" href="img/favicon.png?2"><link rel="stylesheet" href="css/react-native.css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href=""><img src="img/header_logo.png">React Native</a><a class="nav-version" href="/react-native/versions.html">next</a><div class="nav-site-wrapper"><ul class="nav-site nav-site-internal"><li><a href="docs/getting-started.html" class="active" data-target=".nav-docs">Docs</a></li><li><a href="support.html" class="">Support</a></li><li><a href="showcase.html" class="">Showcase</a></li><li><a href="blog/" class="">Blog</a></li></ul><div class="algolia-search-wrapper"><input id="algolia-doc-search" type="text" placeholder="Search docs..."></div><ul class="nav-site nav-site-external"><li><a href="https://github.com/facebook/react-native" class="">GitHub</a></li><li><a href="http://facebook.github.io/react" class="">React</a></li></ul></div></div></div><section class="content wrap documentationContent"><div class="nav-docs"><div class="nav-docs-viewport"><div class="nav-docs-section"><h3>The Basics</h3><ul><li><a style="margin-left:0;" class="" href="docs/getting-started.html">Getting Started</a></li><li><a style="margin-left:0;" class="" href="docs/basics-components.html">Components</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-text.html">Text</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-image.html">Image</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-view.html">View</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-textinput.html">TextInput</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-scrollview.html">ScrollView</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-listview.html">ListView</a></li><li><a style="margin-left:0;" class="" href="docs/network.html">Network</a></li><li><a style="margin-left:0;" class="" href="docs/more-resources.html">More Resources</a></li></ul></div><div class="nav-docs-section"><h3>Guides</h3><ul><li><a style="margin-left:0;" class="" href="docs/integration-with-existing-apps.html">Integration With Existing Apps</a></li><li><a style="margin-left:0;" class="" href="docs/style.html">Style</a></li><li><a style="margin-left:0;" class="" href="docs/colors.html">Colors</a></li><li><a style="margin-left:0;" class="" href="docs/images.html">Images</a></li><li><a style="margin-left:0;" class="" href="docs/handling-touches.html">Handling Touches</a></li><li><a style="margin-left:0;" class="" href="docs/animations.html">Animations</a></li><li><a style="margin-left:0;" class="" href="docs/accessibility.html">Accessibility</a></li><li><a style="margin-left:0;" class="" href="docs/timers.html">Timers</a></li><li><a style="margin-left:0;" class="" href="docs/direct-manipulation.html">Direct Manipulation</a></li><li><a style="margin-left:0;" class="" href="docs/debugging.html">Debugging</a></li><li><a style="margin-left:0;" class="" href="docs/testing.html">Testing</a></li><li><a style="margin-left:0;" class="" href="docs/javascript-environment.html">JavaScript Environment</a></li><li><a style="margin-left:0;" class="" href="docs/navigator-comparison.html">Navigator Comparison</a></li><li><a style="margin-left:0;" class="" href="docs/known-issues.html">Known Issues</a></li><li><a style="margin-left:0;" class="" href="docs/performance.html">Performance</a></li><li><a style="margin-left:0;" class="" href="docs/upgrading.html">Upgrading</a></li><li><a style="margin-left:0;" class="" href="docs/platform-specific-code.html">Platform Specific Code</a></li><li><a style="margin-left:0;" class="" href="docs/gesture-responder-system.html">Gesture Responder System</a></li></ul></div><div class="nav-docs-section"><h3>Guides (iOS)</h3><ul><li><a style="margin-left:0;" class="" href="docs/native-modules-ios.html">Native Modules</a></li><li><a style="margin-left:0;" class="" href="docs/native-components-ios.html">NatiLine truncated
|
||||
accomplish this, provide route objects to the navigator to identify each
|
||||
scene, and also a <code>renderScene</code> function that the navigator can use to
|
||||
render the scene for a given route.</p><p>To change the animation or gesture properties of the scene, provide a
|
||||
<code>configureScene</code> prop to get the config object for a given route. See
|
||||
<code>Navigator.SceneConfigs</code> for default animations and more info on
|
||||
scene config options.</p><h3><a class="anchor" name="basic-usage"></a>Basic Usage <a class="hash-link" href="docs/navigator.html#basic-usage">#</a></h3><div class="prism language-javascript"> <Navigator
|
||||
initialRoute<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>name<span class="token punctuation">:</span> <span class="token string">'My First Scene'</span><span class="token punctuation">,</span> index<span class="token punctuation">:</span> <span class="token number">0</span><span class="token punctuation">}</span><span class="token punctuation">}</span>
|
||||
renderScene<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<MySceneComponent
|
||||
name<span class="token operator">=</span><span class="token punctuation">{</span>route<span class="token punctuation">.</span>name<span class="token punctuation">}</span>
|
||||
onForward<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">var</span> nextIndex <span class="token operator">=</span> route<span class="token punctuation">.</span>index <span class="token operator">+</span> <span class="token number">1</span><span class="token punctuation">;</span>
|
||||
navigator<span class="token punctuation">.</span><span class="token function">push<span class="token punctuation">(</span></span><span class="token punctuation">{</span>
|
||||
name<span class="token punctuation">:</span> <span class="token string">'Scene '</span> <span class="token operator">+</span> nextIndex<span class="token punctuation">,</span>
|
||||
index<span class="token punctuation">:</span> nextIndex<span class="token punctuation">,</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">}</span>
|
||||
onBack<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">if</span> <span class="token punctuation">(</span>route<span class="token punctuation">.</span>index <span class="token operator">></span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>Navigator – React Native | A framework for building native apps using React</title><meta name="viewport" content="width=device-width"><meta property="og:title" content="Navigator – React Native | A framework for building native apps using React"><meta property="og:type" content="website"><meta property="og:url" content="http://facebook.github.io/react-native/index.html"><meta property="og:image" content="http://facebook.github.io/react-native/img/opengraph.png?2"><meta property="og:description" content="A framework for building native apps using React"><base href="/react-native/releases/next/"><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"><link rel="shortcut icon" href="img/favicon.png?2"><link rel="stylesheet" href="css/react-native.css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href=""><img src="img/header_logo.png">React Native</a><a class="nav-version" href="/react-native/versions.html">next</a><div class="nav-site-wrapper"><ul class="nav-site nav-site-internal"><li><a href="docs/getting-started.html" class="active" data-target=".nav-docs">Docs</a></li><li><a href="support.html" class="">Support</a></li><li><a href="showcase.html" class="">Showcase</a></li><li><a href="blog/" class="">Blog</a></li></ul><div class="algolia-search-wrapper"><input id="algolia-doc-search" type="text" placeholder="Search docs..."></div><ul class="nav-site nav-site-external"><li><a href="https://github.com/facebook/react-native" class="">GitHub</a></li><li><a href="http://facebook.github.io/react" class="">React</a></li></ul></div></div></div><section class="content wrap documentationContent"><div class="nav-docs"><div class="nav-docs-viewport"><div class="nav-docs-section"><h3>The Basics</h3><ul><li><a style="margin-left:0;" class="" href="docs/getting-started.html">Getting Started</a></li><li><a style="margin-left:0;" class="" href="docs/basics-components.html">Components</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-text.html">Text</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-image.html">Image</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-view.html">View</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-textinput.html">TextInput</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-scrollview.html">ScrollView</a></li><li><a style="margin-left:0;" class="" href="docs/basics-component-listview.html">ListView</a></li><li><a style="margin-left:0;" class="" href="docs/network.html">Network</a></li><li><a style="margin-left:0;" class="" href="docs/more-resources.html">More Resources</a></li></ul></div><div class="nav-docs-section"><h3>Guides</h3><ul><li><a style="margin-left:0;" class="" href="docs/integration-with-existing-apps.html">Integration With Existing Apps</a></li><li><a style="margin-left:0;" class="" href="docs/style.html">Style</a></li><li><a style="margin-left:0;" class="" href="docs/colors.html">Colors</a></li><li><a style="margin-left:0;" class="" href="docs/images.html">Images</a></li><li><a style="margin-left:0;" class="" href="docs/handling-touches.html">Handling Touches</a></li><li><a style="margin-left:0;" class="" href="docs/animations.html">Animations</a></li><li><a style="margin-left:0;" class="" href="docs/accessibility.html">Accessibility</a></li><li><a style="margin-left:0;" class="" href="docs/timers.html">Timers</a></li><li><a style="margin-left:0;" class="" href="docs/direct-manipulation.html">Direct Manipulation</a></li><li><a style="margin-left:0;" class="" href="docs/debugging.html">Debugging</a></li><li><a style="margin-left:0;" class="" href="docs/testing.html">Testing</a></li><li><a style="margin-left:0;" class="" href="docs/javascript-environment.html">JavaScript Environment</a></li><li><a style="margin-left:0;" class="" href="docs/navigator-comparison.html">Navigator Comparison</a></li><li><a style="margin-left:0;" class="" href="docs/known-issues.html">Known Issues</a></li><li><a style="margin-left:0;" class="" href="docs/performance.html">Performance</a></li><li><a style="margin-left:0;" class="" href="docs/upgrading.html">Upgrading</a></li><li><a style="margin-left:0;" class="" href="docs/platform-specific-code.html">Platform Specific Code</a></li><li><a style="margin-left:0;" class="" href="docs/gesture-responder-system.html">Gesture Responder System</a></li></ul></div><div class="nav-docs-section"><h3>Guides (iOS)</h3><ul><li><a style="margin-left:0;" class="" href="docs/native-modules-ios.html">Native Modules</a></li><li><a style="margin-left:0;" class="" href="docs/native-components-ios.html">NatiLine truncated
|
||||
You should consider using this component instead of <code>NavigatorIOS</code> if you're
|
||||
building a cross-platform app. <code>Navigator</code> is implemented in JavaScript
|
||||
whereas <code>NavigatorIOS</code> is a wrapper around <code>UINavigationController</code>.</p><p>To set up the <code>Navigator</code> you provide one or more objects called routes,
|
||||
to identify each scene. You also provide a <code>renderScene</code> function that
|
||||
renders the scene for each route object.</p><div class="prism language-javascript">import React<span class="token punctuation">,</span> <span class="token punctuation">{</span> Component <span class="token punctuation">}</span> from <span class="token string">'react'</span><span class="token punctuation">;</span>
|
||||
import <span class="token punctuation">{</span> Text<span class="token punctuation">,</span> Navigator <span class="token punctuation">}</span> from <span class="token string">'react-native'</span><span class="token punctuation">;</span>
|
||||
|
||||
class <span class="token class-name">NavAllDay</span> extends <span class="token class-name">Component</span> <span class="token punctuation">{</span>
|
||||
<span class="token function">render<span class="token punctuation">(</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">return</span> <span class="token punctuation">(</span>
|
||||
<Navigator
|
||||
initialRoute<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>name<span class="token punctuation">:</span> <span class="token string">'Awesome Scene'</span><span class="token punctuation">}</span><span class="token punctuation">}</span>
|
||||
renderScene<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<Text<span class="token operator">></span>Hello <span class="token punctuation">{</span>route<span class="token punctuation">.</span>name<span class="token punctuation">}</span><span class="token operator">!</span><<span class="token operator">/</span>Text<span class="token operator">></span>
|
||||
<span class="token punctuation">}</span>
|
||||
style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>padding<span class="token punctuation">:</span> <span class="token number">100</span><span class="token punctuation">}</span><span class="token punctuation">}</span>
|
||||
<span class="token operator">/</span><span class="token operator">></span>
|
||||
<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token punctuation">}</span></div><p>In the above example, <code>initialRoute</code> is used to specify the first route. It
|
||||
contains a <code>name</code> property that identifies the route. The <code>renderScene</code>
|
||||
prop returns a function that displays text based on the route's name.</p><h3><a class="anchor" name="additional-scenes"></a>Additional Scenes <a class="hash-link" href="docs/navigator.html#additional-scenes">#</a></h3><p>The first example demonstrated one scene. To set up multiple scenes, you pass
|
||||
the <code>initialRouteStack</code> prop to <code>Navigator</code>:</p><div class="prism language-javascript"><span class="token function">render<span class="token punctuation">(</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
const routes <span class="token operator">=</span> <span class="token punctuation">[</span>
|
||||
<span class="token punctuation">{</span>name<span class="token punctuation">:</span> <span class="token string">'First Scene'</span><span class="token punctuation">,</span> index<span class="token punctuation">:</span> <span class="token number">0</span><span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span>name<span class="token punctuation">:</span> <span class="token string">'Second Scene'</span><span class="token punctuation">,</span> index<span class="token punctuation">:</span> <span class="token number">1</span><span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">]</span><span class="token punctuation">;</span>
|
||||
<span class="token keyword">return</span> <span class="token punctuation">(</span>
|
||||
<Navigator
|
||||
initialRoute<span class="token operator">=</span><span class="token punctuation">{</span>routes<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">}</span>
|
||||
initialRouteStack<span class="token operator">=</span><span class="token punctuation">{</span>routes<span class="token punctuation">}</span>
|
||||
renderScene<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<TouchableHighlight onPress<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">if</span> <span class="token punctuation">(</span>route<span class="token punctuation">.</span>index <span class="token operator">===</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
navigator<span class="token punctuation">.</span><span class="token function">push<span class="token punctuation">(</span></span>routes<span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
|
||||
navigator<span class="token punctuation">.</span><span class="token function">pop<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">}</span>
|
||||
<span class="token operator">/</span><span class="token operator">></span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token operator">></span>
|
||||
<Text<span class="token operator">></span>Hello <span class="token punctuation">{</span>route<span class="token punctuation">.</span>name<span class="token punctuation">}</span><span class="token operator">!</span><<span class="token operator">/</span>Text<span class="token operator">></span>
|
||||
<<span class="token operator">/</span>TouchableHighlight<span class="token operator">></span>
|
||||
<span class="token punctuation">}</span>
|
||||
style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>padding<span class="token punctuation">:</span> <span class="token number">100</span><span class="token punctuation">}</span><span class="token punctuation">}</span>
|
||||
<span class="token operator">/</span><span class="token operator">></span>
|
||||
<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span></div><p>In the above example, a <code>routes</code> variable is defined with two route objects
|
||||
representing two scenes. Each route has an <code>index</code> property that is used to
|
||||
manage the scene being rendered. The <code>renderScene</code> method is changed to
|
||||
either push or pop the navigator depending on the current route's index.
|
||||
Finally, the <code>Text</code> component in the scene is now wrapped in a
|
||||
<code>TouchableHighlight</code> component to help trigger the navigator transitions.</p><h3><a class="anchor" name="navigation-bar"></a>Navigation Bar <a class="hash-link" href="docs/navigator.html#navigation-bar">#</a></h3><p>You can optionally pass in your own navigation bar by returning a
|
||||
<code>Navigator.NavigationBar</code> component to the <code>navigationBar</code> prop in
|
||||
<code>Navigator</code>. You can configure the navigation bar properties, through
|
||||
the <code>routeMapper</code> prop. There you set up the left, right, and title
|
||||
properties of the navigation bar:</p><div class="prism language-javascript"><Navigator
|
||||
renderScene<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<span class="token comment" spellcheck="true"> // ...
|
||||
</span> <span class="token punctuation">}</span>
|
||||
navigationBar<span class="token operator">=</span><span class="token punctuation">{</span>
|
||||
<Navigator<span class="token punctuation">.</span>NavigationBar
|
||||
routeMapper<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>
|
||||
LeftButton<span class="token punctuation">:</span> <span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">,</span> index<span class="token punctuation">,</span> navState<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token punctuation">(</span><Text<span class="token operator">></span>Cancel<<span class="token operator">/</span>Text<span class="token operator">></span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
RightButton<span class="token punctuation">:</span> <span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">,</span> index<span class="token punctuation">,</span> navState<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token punctuation">(</span><Text<span class="token operator">></span>Done<<span class="token operator">/</span>Text<span class="token operator">></span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
Title<span class="token punctuation">:</span> <span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">,</span> index<span class="token punctuation">,</span> navState<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token punctuation">(</span><Text<span class="token operator">></span>Awesome Nav Bar<<span class="token operator">/</span>Text<span class="token operator">></span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">}</span>
|
||||
style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>backgroundColor<span class="token punctuation">:</span> <span class="token string">'gray'</span><span class="token punctuation">}</span><span class="token punctuation">}</span>
|
||||
<span class="token operator">/</span><span class="token operator">></span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token operator">/</span><span class="token operator">></span></div><p>When configuring the left, right, and title items for the navigation bar,
|
||||
you have access to info such as the current route object and navigation
|
||||
state. This allows you to customize the title for each scene as well as
|
||||
the buttons. For example, you can choose to hide the left button for one of
|
||||
the scenes.</p><p>Typically you want buttons to represent the left and right buttons. Building
|
||||
on the previous example, you can set this up as follows:</p><div class="prism language-javascript">LeftButton<span class="token punctuation">:</span> <span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">,</span> index<span class="token punctuation">,</span> navState<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<span class="token punctuation">{</span>
|
||||
<span class="token keyword">if</span> <span class="token punctuation">(</span>route<span class="token punctuation">.</span>index <span class="token operator">===</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">return</span> <span class="token keyword">null</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">return</span> <span class="token punctuation">(</span>
|
||||
<TouchableHighlight onPress<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> navigator<span class="token punctuation">.</span><span class="token function">pop<span class="token punctuation">(</span></span><span class="token punctuation">)</span><span class="token punctuation">}</span><span class="token operator">></span>
|
||||
<Text<span class="token operator">></span>Back<<span class="token operator">/</span>Text<span class="token operator">></span>
|
||||
<<span class="token operator">/</span>TouchableHighlight<span class="token operator">></span>
|
||||
<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token operator">/</span><span class="token operator">></span></div></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="docs/navigator.html#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="configurescene"></a>configureScene <span class="propType">function</span> <a class="hash-link" href="docs/navigator.html#configurescene">#</a></h4><div><p>Optional function that allows configuration about scene animations and
|
||||
gestures. Will be invoked with the route and the routeStack and should
|
||||
return a scene configuration object</p><div class="prism language-javascript"><span class="token punctuation">(</span>route<span class="token punctuation">,</span> routeStack<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> Navigator<span class="token punctuation">.</span>SceneConfigs<span class="token punctuation">.</span>FloatFromRight</div><p>Available options are:</p><ul><li>Navigator.SceneConfigs.PushFromRight (default)</li><li>Navigator.SceneConfigs.FloatFromRight</li><li>Navigator.SceneConfigs.FloatFromLeft</li><li>Navigator.SceneConfigs.FloatFromBottom</li><li>Navigator.SceneConfigs.FloatFromBottomAndroid</li><li>Navigator.SceneConfigs.FadeAndroid</li><li>Navigator.SceneConfigs.HorizontalSwipeJump</li><li>Navigator.SceneConfigs.HorizontalSwipeJumpFromRight</li><li>Navigator.SceneConfigs.VerticalUpSwipeJump</li><li>Navigator.SceneConfigs.VerticalDownSwipeJump</li></ul></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="initialroute"></a>initialRoute <span class="propType">object</span> <a class="hash-link" href="docs/navigator.html#initialroute">#</a></h4><div><p>Specify a route to start on. A route is an object that the navigator
|
||||
will use to identify each scene to render. <code>initialRoute</code> must be
|
||||
a route in the <code>initialRouteStack</code> if both props are provided. The
|
||||
<code>initialRoute</code> will default to the last item in the <code>initialRouteStack</code>.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="initialroutestack"></a>initialRouteStack <span class="propType"><span>[object]</span></span> <a class="hash-link" href="docs/navigator.html#initialroutestack">#</a></h4><div><p>Provide a set of routes to initially mount. Required if no initialRoute
|
||||
is provided. Otherwise, it will default to an array containing only the
|
||||
<code>initialRoute</code></p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="navigationbar"></a>navigationBar <span class="propType">node</span> <a class="hash-link" href="docs/navigator.html#navigationbar">#</a></h4><div><p>Optionally provide a component as navigation bar that persists across scene
|
||||
transitions. The component will receive two props: <code>navigator</code> and <code>navState</code>.
|
||||
It will be rerendered when the routes change.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="navigator"></a>navigator <span class="propType">object</span> <a class="hash-link" href="docs/navigator.html#navigator">#</a></h4><div><p>Optionally provide the navigator object from a parent Navigator</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="ondidfocus"></a>onDidFocus <span class="propType">function</span> <a class="hash-link" href="docs/navigator.html#ondidfocus">#</a></h4><div><p>Will be called with the new route of each scene after the transition is
|
||||
complete or after the initial mounting</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onwillfocus"></a>onWillFocus <span class="propType">function</span> <a class="hash-link" href="docs/navigator.html#onwillfocus">#</a></h4><div><p>Will emit the target route upon mounting and before each nav transition</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="renderscene"></a>renderScene <span class="propType">function</span> <a class="hash-link" href="docs/navigator.html#renderscene">#</a></h4><div><p>Required function which renders the scene for a given route. Will be
|
||||
invoked with the route and the navigator object</p><div class="prism language-javascript"><span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<MySceneComponent title<span class="token operator">=</span><span class="token punctuation">{</span>route<span class="token punctuation">.</span>title<span class="token punctuation">}</span> navigator<span class="token operator">=</span><span class="token punctuation">{</span>navigator<span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">></span></div></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="scenestyle"></a>sceneStyle <span class="propType"><a href="docs/view.html#style">View#style</a></span> <a class="hash-link" href="docs/navigator.html#scenestyle">#</a></h4><div><p>Styles to apply to the container of each scene</p></div></div></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="docs/navigator.html#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="immediatelyresetroutestack"></a>immediatelyResetRouteStack<span class="propType">(nextRouteStack)</span> <a class="hash-link" href="docs/navigator.html#immediatelyresetroutestack">#</a></h4><div><p>Reset every scene with an array of routes.</p></div><div><strong>Parameters:</strong><table class="params"><thead><tr><th>Name and Type</th><th>Description</th></tr></thead><tbody><tr><td>nextRouteStack<br><br><div><span>RouteStack</span></div></td><td class="description"><div><p>Next route stack to reinitialize. This
|
||||
doesn't accept stack item <code>id</code>s, which implies that all existing items are
|
||||
destroyed, and then potentially recreated according to <code>routeStack</code>. Does
|
||||
not animate, immediately replaces and rerenders navigation bar and stack
|
||||
items.</p></div></td></tr></tbody></table></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="jumpto"></a>jumpTo<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#jumpto">#</a></h4><div><p>Transition to an existing scene without unmounting</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="jumpforward"></a>jumpForward<span class="propType">()</span> <a class="hash-link" href="docs/navigator.html#jumpforward">#</a></h4><div><p>Jump forward to the next scene in the route stack.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="jumpback"></a>jumpBack<span class="propType">()</span> <a class="hash-link" href="docs/navigator.html#jumpback">#</a></h4><div><p>Jump backward without unmounting the current scene.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="push"></a>push<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#push">#</a></h4><div><p>Navigate forward to a new scene, squashing any scenes that you could
|
||||
<code>jumpForward</code> to.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="pop"></a>pop<span class="propType">()</span> <a class="hash-link" href="docs/navigator.html#pop">#</a></h4><div><p>Transition back and unmount the current scene.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="replaceatindex"></a>replaceAtIndex<span class="propType">(route, index, cb)</span> <a class="hash-link" href="docs/navigator.html#replaceatindex">#</a></h4><div><p>Replace a scene as specified by an index</p><p><code>index</code> specifies the route in the stack that should be replaced.
|
||||
If it's negative, it counts from the back.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="replace"></a>replace<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#replace">#</a></h4><div><p>Replace the current scene with a new route.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="replaceprevious"></a>replacePrevious<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#replaceprevious">#</a></h4><div><p>Replace the previous scene.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="poptotop"></a>popToTop<span class="propType">()</span> <a class="hash-link" href="docs/navigator.html#poptotop">#</a></h4><div><p>Pop to the first scene in the stack, unmounting every other scene.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="poptoroute"></a>popToRoute<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#poptoroute">#</a></h4><div><p>Pop to a particular scene, as specified by its route.
|
||||
All scenes after it will be unmounted.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="replacepreviousandpop"></a>replacePreviousAndPop<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#replacepreviousandpop">#</a></h4><div><p>Replace the previous scene and pop to it.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="resetto"></a>resetTo<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#resetto">#</a></h4><div><p>Navigate to a new scene and reset route stack.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getcurrentroutes"></a>getCurrentRoutes<span class="propType">()</span> <a class="hash-link" href="docs/navigator.html#getcurrentroutes">#</a></h4><div><p>Returns the current list of routes.</p></div></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="docs/navigatorios.html#content">Next →</a></div></div><noscript></noscript></section><footer class="wrap"><div class="center">© 2016 Facebook Inc.</div></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">,</span></div><p>This sets up a left navigator bar button that's visible on scenes after the
|
||||
the first one. When the button is tapped the navigator is popped.</p><h3><a class="anchor" name="scene-transitions"></a>Scene Transitions <a class="hash-link" href="docs/navigator.html#scene-transitions">#</a></h3><p>To change the animation or gesture properties of the scene, provide a
|
||||
<code>configureScene</code> prop to get the config object for a given route:</p><div class="prism language-javascript"><Navigator
|
||||
renderScene<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<span class="token comment" spellcheck="true"> // ...
|
||||
</span> <span class="token punctuation">}</span>
|
||||
configureScene<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span>route<span class="token punctuation">,</span> routeStack<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
Navigator<span class="token punctuation">.</span>SceneConfigs<span class="token punctuation">.</span>FloatFromBottom<span class="token punctuation">}</span>
|
||||
<span class="token operator">/</span><span class="token operator">></span></div><p>In the above example, the newly pushed scene will float up from the bottom.
|
||||
See <code>Navigator.SceneConfigs</code> for default animations and more info on
|
||||
available <a href="/react-native/docs/navigator.html#configurescene" target="">scene config options</a>.</p></div><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="docs/navigator.html#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="configurescene"></a>configureScene <span class="propType">function</span> <a class="hash-link" href="docs/navigator.html#configurescene">#</a></h4><div><p>Optional function where you can configure scene animations and
|
||||
gestures. Will be invoked with <code>route</code> and <code>routeStack</code> parameters,
|
||||
where <code>route</code> corresponds to the current scene being rendered by the
|
||||
<code>Navigator</code> and <code>routeStack</code> is the set of currently mounted routes
|
||||
that the navigator could transition to.</p><p>The function should return a scene configuration object.</p><div class="prism language-javascript"><span class="token punctuation">(</span>route<span class="token punctuation">,</span> routeStack<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> Navigator<span class="token punctuation">.</span>SceneConfigs<span class="token punctuation">.</span>FloatFromRight</div><p>Available scene configutation options are:</p><ul><li>Navigator.SceneConfigs.PushFromRight (default)</li><li>Navigator.SceneConfigs.FloatFromRight</li><li>Navigator.SceneConfigs.FloatFromLeft</li><li>Navigator.SceneConfigs.FloatFromBottom</li><li>Navigator.SceneConfigs.FloatFromBottomAndroid</li><li>Navigator.SceneConfigs.FadeAndroid</li><li>Navigator.SceneConfigs.HorizontalSwipeJump</li><li>Navigator.SceneConfigs.HorizontalSwipeJumpFromRight</li><li>Navigator.SceneConfigs.VerticalUpSwipeJump</li><li>Navigator.SceneConfigs.VerticalDownSwipeJump</li></ul></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="initialroute"></a>initialRoute <span class="propType">object</span> <a class="hash-link" href="docs/navigator.html#initialroute">#</a></h4><div><p>The initial route for navigation. A route is an object that the navigator
|
||||
will use to identify each scene it renders.</p><p>If both <code>initialRoute</code> and <code>initialRouteStack</code> props are passed to
|
||||
<code>Navigator</code>, then <code>initialRoute</code> must be in a route in
|
||||
<code>initialRouteStack</code>. If <code>initialRouteStack</code> is passed as a prop but
|
||||
<code>initialRoute</code> is not, then <code>initialRoute</code> will default internally to
|
||||
the last item in <code>initialRouteStack</code>.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="initialroutestack"></a>initialRouteStack <span class="propType"><span>[object]</span></span> <a class="hash-link" href="docs/navigator.html#initialroutestack">#</a></h4><div><p>Pass this in to provide a set of routes to initially mount. This prop
|
||||
is required if <code>initialRoute</code> is not provided to the navigator. If this
|
||||
prop is not passed in, it will default internally to an array
|
||||
containing only <code>initialRoute</code>.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="navigationbar"></a>navigationBar <span class="propType">node</span> <a class="hash-link" href="docs/navigator.html#navigationbar">#</a></h4><div><p>Use this to provide an optional component representing a navigation bar
|
||||
that is persisted across scene transitions. This component will receive
|
||||
two props: <code>navigator</code> and <code>navState</code> representing the navigator
|
||||
component and its state. The component is re-rendered when the route
|
||||
changes.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="navigator"></a>navigator <span class="propType">object</span> <a class="hash-link" href="docs/navigator.html#navigator">#</a></h4><div><p>Optionally pass in the navigator object from a parent <code>Navigator</code>.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="ondidfocus"></a>onDidFocus <span class="propType">function</span> <a class="hash-link" href="docs/navigator.html#ondidfocus">#</a></h4><div><p>Will be called with the new route of each scene after the transition is
|
||||
complete or after the initial mounting.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="onwillfocus"></a>onWillFocus <span class="propType">function</span> <a class="hash-link" href="docs/navigator.html#onwillfocus">#</a></h4><div><p>Pass in a function to get notified with the target route when
|
||||
the navigator component is mounted and before each navigator transition.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="renderscene"></a>renderScene <span class="propType">function</span> <a class="hash-link" href="docs/navigator.html#renderscene">#</a></h4><div><p>Required function which renders the scene for a given route. Will be
|
||||
invoked with the <code>route</code> and the <code>navigator</code> object.</p><div class="prism language-javascript"><span class="token punctuation">(</span>route<span class="token punctuation">,</span> navigator<span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span>
|
||||
<MySceneComponent title<span class="token operator">=</span><span class="token punctuation">{</span>route<span class="token punctuation">.</span>title<span class="token punctuation">}</span> navigator<span class="token operator">=</span><span class="token punctuation">{</span>navigator<span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">></span></div></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="scenestyle"></a>sceneStyle <span class="propType"><a href="docs/view.html#style">View#style</a></span> <a class="hash-link" href="docs/navigator.html#scenestyle">#</a></h4><div><p>Styles to apply to the container of each scene.</p></div></div></div><span><h3><a class="anchor" name="methods"></a>Methods <a class="hash-link" href="docs/navigator.html#methods">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="immediatelyresetroutestack"></a>immediatelyResetRouteStack<span class="propType">(nextRouteStack)</span> <a class="hash-link" href="docs/navigator.html#immediatelyresetroutestack">#</a></h4><div><p>Reset every scene with an array of routes.</p></div><div><strong>Parameters:</strong><table class="params"><thead><tr><th>Name and Type</th><th>Description</th></tr></thead><tbody><tr><td>nextRouteStack<br><br><div><span>RouteStack</span></div></td><td class="description"><div><p>Next route stack to reinitialize.
|
||||
All existing route stacks are destroyed an potentially recreated. There
|
||||
is no accompanying animation and this method immediately replaces and
|
||||
re-renders the navigation bar and the stack items.</p></div></td></tr></tbody></table></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="jumpto"></a>jumpTo<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#jumpto">#</a></h4><div><p>Transition to an existing scene without unmounting.</p></div><div><strong>Parameters:</strong><table class="params"><thead><tr><th>Name and Type</th><th>Description</th></tr></thead><tbody><tr><td>route<br><br><div><span>object</span></div></td><td class="description"><div><p>Route to transition to. The specified route must
|
||||
be in the currently mounted set of routes defined in <code>routeStack</code>.</p></div></td></tr></tbody></table></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="jumpforward"></a>jumpForward<span class="propType">()</span> <a class="hash-link" href="docs/navigator.html#jumpforward">#</a></h4><div><p>Jump forward to the next scene in the route stack.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="jumpback"></a>jumpBack<span class="propType">()</span> <a class="hash-link" href="docs/navigator.html#jumpback">#</a></h4><div><p>Jump backward without unmounting the current scene.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="push"></a>push<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#push">#</a></h4><div><p>Navigate forward to a new scene, squashing any scenes that you could
|
||||
jump forward to.</p></div><div><strong>Parameters:</strong><table class="params"><thead><tr><th>Name and Type</th><th>Description</th></tr></thead><tbody><tr><td>route<br><br><div><span>object</span></div></td><td class="description"><div><p>Route to push into the navigator stack.</p></div></td></tr></tbody></table></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="pop"></a>pop<span class="propType">()</span> <a class="hash-link" href="docs/navigator.html#pop">#</a></h4><div><p>Transition back and unmount the current scene.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="replaceatindex"></a>replaceAtIndex<span class="propType">(route, index, cb)</span> <a class="hash-link" href="docs/navigator.html#replaceatindex">#</a></h4><div><p>Replace a scene as specified by an index.</p></div><div><strong>Parameters:</strong><table class="params"><thead><tr><th>Name and Type</th><th>Description</th></tr></thead><tbody><tr><td>route<br><br><div><span>object</span></div></td><td class="description"><div><p>Route representing the new scene to render.</p></div></td></tr><tr><td>index<br><br><div><span>number</span></div></td><td class="description"><div><p>The route in the stack that should be replaced.
|
||||
If negative, it counts from the back of the stack.</p></div></td></tr><tr><td>cb<br><br><div><span>Function</span></div></td><td class="description"><div><p>Callback function when the scene has been replaced.</p></div></td></tr></tbody></table></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="replace"></a>replace<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#replace">#</a></h4><div><p>Replace the current scene with a new route.</p></div><div><strong>Parameters:</strong><table class="params"><thead><tr><th>Name and Type</th><th>Description</th></tr></thead><tbody><tr><td>route<br><br><div><span>object</span></div></td><td class="description"><div><p>Route that replaces the current scene.</p></div></td></tr></tbody></table></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="replaceprevious"></a>replacePrevious<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#replaceprevious">#</a></h4><div><p>Replace the previous scene.</p></div><div><strong>Parameters:</strong><table class="params"><thead><tr><th>Name and Type</th><th>Description</th></tr></thead><tbody><tr><td>route<br><br><div><span>object</span></div></td><td class="description"><div><p>Route that replaces the previous scene.</p></div></td></tr></tbody></table></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="poptotop"></a>popToTop<span class="propType">()</span> <a class="hash-link" href="docs/navigator.html#poptotop">#</a></h4><div><p>Pop to the first scene in the stack, unmounting every other scene.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="poptoroute"></a>popToRoute<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#poptoroute">#</a></h4><div><p>Pop to a particular scene, as specified by its route.
|
||||
All scenes after it will be unmounted.</p></div><div><strong>Parameters:</strong><table class="params"><thead><tr><th>Name and Type</th><th>Description</th></tr></thead><tbody><tr><td>route<br><br><div><span>object</span></div></td><td class="description"><div><p>Route to pop to.</p></div></td></tr></tbody></table></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="replacepreviousandpop"></a>replacePreviousAndPop<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#replacepreviousandpop">#</a></h4><div><p>Replace the previous scene and pop to it.</p></div><div><strong>Parameters:</strong><table class="params"><thead><tr><th>Name and Type</th><th>Description</th></tr></thead><tbody><tr><td>route<br><br><div><span>object</span></div></td><td class="description"><div><p>Route that replaces the previous scene.</p></div></td></tr></tbody></table></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="resetto"></a>resetTo<span class="propType">(route)</span> <a class="hash-link" href="docs/navigator.html#resetto">#</a></h4><div><p>Navigate to a new scene and reset route stack.</p></div><div><strong>Parameters:</strong><table class="params"><thead><tr><th>Name and Type</th><th>Description</th></tr></thead><tbody><tr><td>route<br><br><div><span>object</span></div></td><td class="description"><div><p>Route to navigate to.</p></div></td></tr></tbody></table></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="getcurrentroutes"></a>getCurrentRoutes<span class="propType">()</span> <a class="hash-link" href="docs/navigator.html#getcurrentroutes">#</a></h4><div><p>Returns the current list of routes.</p></div></div></div></span></div><div class="docs-prevnext"><a class="docs-next" href="docs/navigatorios.html#content">Next →</a></div></div><noscript></noscript></section><footer class="wrap"><div class="center">© 2016 Facebook Inc.</div></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
|
||||
Reference in new issue
Block a user