You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: blog/2024-03-25-introducing-static-api.md
+7-7
Original file line number
Diff line number
Diff line change
@@ -15,13 +15,13 @@ To solve this, we’re adding a new static API to React Navigation 7. It’s not
15
15
16
16
:::note
17
17
18
-
The static API it’s an additional optional API. The dynamic API isn’t going away and will remain a firstclass API of React Navigation. In fact, the static API is written entirely on top of the dynamic API.
18
+
The static API it’s an additional optional API. The dynamic API isn’t going away and will remain a first-class API of React Navigation. In fact, the static API is written entirely on top of the dynamic API.
19
19
20
20
:::
21
21
22
22
## Overview
23
23
24
-
With the dynamic API, first we import a function such as `createStackNavigator`, then we use it to define screens - each screen has a `name` and a `component`:
24
+
With the dynamic API, first, we import a function such as `createStackNavigator`, and then we use it to define screens - each screen has a `name` and a `component`:
25
25
26
26
```js
27
27
constStack=createStackNavigator();
@@ -40,7 +40,7 @@ function RootStack() {
40
40
The static API follows the same principles. Here we are specifying screens in a property called `screens`, the name of the screen is a key in the configuration object and the value contains the component to render:
41
41
42
42
```js
43
-
constRootStack= {
43
+
constRootStack=createStackNavigator({
44
44
screens: {
45
45
Home: {
46
46
screen: Home,
@@ -52,10 +52,10 @@ const RootStack = {
52
52
screen: Settings,
53
53
},
54
54
},
55
-
};
55
+
});
56
56
```
57
57
58
-
Then after writing our navigation config, we call `createStaticNavigation` and render the returned the component:
58
+
Then after writing our navigation config, we call `createStaticNavigation` and render the returned component:
@@ -153,7 +153,7 @@ See [Configuring links](/docs/7.x/configuring-links?config=static) for more deta
153
153
154
154
## Authentication Flow
155
155
156
-
One of the nice things about the dynamic APIs is declarative authentication flow. You declaratively define which screens are available for loggedin and guest users, and React Navigation would handle showing the appropriate screens automatically. To keep a similar experience, we added some dynamism to the new static API with the if property:
156
+
One of the nice things about the dynamic APIs is the declarative authentication flow. You declaratively define which screens are available for logged-in and guest users, and React Navigation would handle showing the appropriate screens automatically. To keep a similar experience, we added some dynamism to the new static API with the if property:
In addition to the static API, React Navigation 7 also includes a lot of other improvements and new features. Make sure to go through the [upgrade guide](/docs/7.x/upgrading-from-6.x) to see all the changes.
192
192
193
-
We would love to get feedback from the community on how it works for you and catch any issues before the stable release. If you have any feedback or suggestions, please let us know on our [GitHub Discussions forum](https://github.com/react-navigation/react-navigation/discussions). Or if you find any issues, please report them on our [GitHub issues](https://github.com/react-navigation/react-navigation/issues).
193
+
We would love to get feedback from the community on how it works for you and catch any issues before the stable release. If you have any feedback or suggestions, please let us know on our [GitHub Discussions forum](https://github.com/react-navigation/react-navigation/discussions). If you find any issues, please report them on our [GitHub issues](https://github.com/react-navigation/react-navigation/issues).
0 commit comments