Parcourir la source

Update documentation to avoid confusion on component layout type (#4129)

Adrien Thiery il y a 6 ans
Parent
révision
3b62b01e30
2 fichiers modifiés avec 22 ajouts et 1 suppressions
  1. 2
    0
      docs/docs/Installing.md
  2. 20
    1
      docs/docs/Usage.md

+ 2
- 0
docs/docs/Installing.md Voir le fichier

@@ -366,3 +366,5 @@ import App from "./App";
366 366
 +  });
367 367
 +});
368 368
 ```
369
+
370
+⚠️ we use the layout type `component` here, which renders a React component but does not allow you to navigate to others. See [Usage](./Usage.md) and [LayoutTypes](./layout-types.md) for more options.

+ 20
- 1
docs/docs/Usage.md Voir le fichier

@@ -37,6 +37,25 @@ Navigation.events().registerAppLaunchedListener(() => {
37 37
 });
38 38
 ```
39 39
 
40
+As specified in the [LayoutTypes](./layout-types.md) part of the documentation, we use the layout type `component` here, which renders a React component but does not allow you to navigate to others.
41
+
42
+If you want to navigate, use a `stack` layout type:
43
+```js
44
+Navigation.events().registerAppLaunchedListener(() => {
45
+  Navigation.setRoot({
46
+    root: {
47
+      stack: {
48
+        children: [{
49
+          component: {
50
+            name: "navigation.playground.WelcomeScreen"
51
+          }
52
+        }]
53
+      }
54
+    }
55
+  });
56
+});
57
+```
58
+
40 59
 ## Screen Lifecycle
41 60
 
42 61
 The `componentDidAppear` and `componentDidDisappear` functions are special React Native Navigation lifecycle callbacks that are called on the component when it appears and disappears (after it was bounded using `Navigation.events().bindComponent(this)`). 
@@ -79,7 +98,7 @@ class LifecycleScreenExample extends Component {
79 98
     return (
80 99
       <View style={styles.root}>
81 100
         <Text style={styles.h1}>{`Lifecycle Screen`}</Text>
82
-	      <Text style={styles.h1}>{this.state.text}</Text>
101
+        <Text style={styles.h1}>{this.state.text}</Text>
83 102
       </View>
84 103
     );
85 104
   }