Browse Source

[docs] Update part of usage.md to reflect new API changes (#2601)

* Update part of usage.md to reflect new API changes

* Update usage.md
jamsch 6 years ago
parent
commit
211340b22f
1 changed files with 31 additions and 27 deletions
  1. 31
    27
      docs/docs/usage.md

+ 31
- 27
docs/docs/usage.md View File

12
 ```js
12
 ```js
13
 Navigation.events().onAppLaunched(() => {
13
 Navigation.events().onAppLaunched(() => {
14
   Navigation.setRoot({
14
   Navigation.setRoot({
15
-    container: {
15
+    component: {
16
       name: 'navigation.playground.WelcomeScreen'
16
       name: 'navigation.playground.WelcomeScreen'
17
     }
17
     }
18
   });
18
   });
19
 });
19
 });
20
 ```
20
 ```
21
 
21
 
22
-### registerContainer(screenID, generator)
22
+### registerComponent(screenID, generator)
23
 Every screen component in your app must be registered with a unique name. The component itself is a traditional React component extending React.Component.
23
 Every screen component in your app must be registered with a unique name. The component itself is a traditional React component extending React.Component.
24
 
24
 
25
 ```js
25
 ```js
26
-Navigation.registerContainer(`navigation.playground.WelcomeScreen`, () => WelcomeScreen);
26
+Navigation.registerComponent(`navigation.playground.WelcomeScreen`, () => WelcomeScreen);
27
 ```
27
 ```
28
 
28
 
29
 ### setRoot({params})
29
 ### setRoot({params})
31
 
31
 
32
 ```js
32
 ```js
33
 Navigation.setRoot({
33
 Navigation.setRoot({
34
-  container: {
35
-    name: 'navigation.playground.WelcomeScreen'
36
-  },
37
   sideMenu: {
34
   sideMenu: {
38
     left: {
35
     left: {
39
-      container: {
36
+      component: {
40
         name: 'navigation.playground.TextScreen',
37
         name: 'navigation.playground.TextScreen',
41
         passProps: {
38
         passProps: {
42
           text: 'This is a left side menu screen'
39
           text: 'This is a left side menu screen'
43
         }
40
         }
44
       }
41
       }
45
     },
42
     },
43
+    center: {
44
+      component: {
45
+        name: 'navigation.playground.WelcomeScreen'
46
+      },
47
+    },
46
     right: {
48
     right: {
47
-      container: {
49
+      component: {
48
         name: 'navigation.playground.TextScreen',
50
         name: 'navigation.playground.TextScreen',
49
         passProps: {
51
         passProps: {
50
           text: 'This is a right side menu screen'
52
           text: 'This is a right side menu screen'
58
 
60
 
59
 ```js
61
 ```js
60
 Navigation.setRoot({
62
 Navigation.setRoot({
61
-  bottomTabs: [
62
-    {
63
-      container: {
64
-        name: 'navigation.playground.TextScreen',
65
-        passProps: {
66
-          text: 'This is tab 1',
67
-          myFunction: () => 'Hello from a function!'
68
-        }
69
-      }
70
-    },
71
-    {
72
-      container: {
73
-        name: 'navigation.playground.TextScreen',
74
-        passProps: {
75
-          text: 'This is tab 2'
76
-        }
77
-      }
78
-    }
79
-  ]
63
+  bottomTabs: {
64
+    children: [
65
+      {
66
+        component: {
67
+          name: 'navigation.playground.TextScreen',
68
+          passProps: {
69
+            text: 'This is tab 1',
70
+            myFunction: () => 'Hello from a function!',
71
+          },
72
+        },
73
+      },
74
+      {
75
+        component: {
76
+          name: 'navigation.playground.TextScreen',
77
+          passProps: {
78
+            text: 'This is tab 2',
79
+          },
80
+        },
81
+      },
82
+    ],
83
+  },
80
 });
84
 });
81
 ```
85
 ```
82
 ## Screen API
86
 ## Screen API