mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
@@ -34,7 +34,7 @@
|
||||
<p>Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.</p>
|
||||
</blockquote>
|
||||
<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">import</span> React, {Component} <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
|
||||
<span class="hljs-keyword">import</span> {Modal, Text, TouchableHighlight, View} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
|
||||
<span class="hljs-keyword">import</span> {Modal, Text, TouchableHighlight, View, Alert} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
|
||||
|
||||
<span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">ModalExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">Component</span> </span>{
|
||||
state = {
|
||||
@@ -53,7 +53,7 @@
|
||||
<span class="hljs-attr">transparent</span>=<span class="hljs-string">{false}</span>
|
||||
<span class="hljs-attr">visible</span>=<span class="hljs-string">{this.state.modalVisible}</span>
|
||||
<span class="hljs-attr">onRequestClose</span>=<span class="hljs-string">{()</span> =></span> {
|
||||
alert('Modal has been closed.');
|
||||
Alert.alert('Modal has been closed.');
|
||||
}}>
|
||||
<span class="hljs-tag"><<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{{marginTop:</span> <span class="hljs-attr">22</span>}}></span>
|
||||
<span class="hljs-tag"><<span class="hljs-name">View</span>></span>
|
||||
|
||||
@@ -34,7 +34,7 @@
|
||||
<p>Note: If you need more control over how to present modals over the rest of your app, then consider using a top-level Navigator.</p>
|
||||
</blockquote>
|
||||
<pre><code class="hljs css languages- javascript"><span class="hljs-keyword">import</span> React, {Component} <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
|
||||
<span class="hljs-keyword">import</span> {Modal, Text, TouchableHighlight, View} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
|
||||
<span class="hljs-keyword">import</span> {Modal, Text, TouchableHighlight, View, Alert} <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
|
||||
|
||||
<span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">ModalExample</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">Component</span> </span>{
|
||||
state = {
|
||||
@@ -53,7 +53,7 @@
|
||||
<span class="hljs-attr">transparent</span>=<span class="hljs-string">{false}</span>
|
||||
<span class="hljs-attr">visible</span>=<span class="hljs-string">{this.state.modalVisible}</span>
|
||||
<span class="hljs-attr">onRequestClose</span>=<span class="hljs-string">{()</span> =></span> {
|
||||
alert('Modal has been closed.');
|
||||
Alert.alert('Modal has been closed.');
|
||||
}}>
|
||||
<span class="hljs-tag"><<span class="hljs-name">View</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{{marginTop:</span> <span class="hljs-attr">22</span>}}></span>
|
||||
<span class="hljs-tag"><<span class="hljs-name">View</span>></span>
|
||||
|
||||
@@ -47,6 +47,8 @@ const App = createStackNavigator({
|
||||
Home: { screen: HomeScreen },
|
||||
Profile: { screen: ProfileScreen },
|
||||
});
|
||||
|
||||
export <span class="hljs-keyword">default</span> App;
|
||||
</code></pre>
|
||||
<p>Each screen component can set navigation options such as the header title. It can use action creators on the <code>navigation</code> prop to link to other screens:</p>
|
||||
<pre><code class="hljs"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">HomeScreen</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span> </span>{
|
||||
|
||||
@@ -47,6 +47,8 @@ const App = createStackNavigator({
|
||||
Home: { screen: HomeScreen },
|
||||
Profile: { screen: ProfileScreen },
|
||||
});
|
||||
|
||||
export <span class="hljs-keyword">default</span> App;
|
||||
</code></pre>
|
||||
<p>Each screen component can set navigation options such as the header title. It can use action creators on the <code>navigation</code> prop to link to other screens:</p>
|
||||
<pre><code class="hljs"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">HomeScreen</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">React</span>.<span class="hljs-title">Component</span> </span>{
|
||||
|
||||
Reference in New Issue
Block a user