Skip to content

Commit a467981

Browse files
committed
Update TS guide
1 parent 3504693 commit a467981

File tree

1 file changed

+11
-1
lines changed

1 file changed

+11
-1
lines changed

versioned_docs/version-7.x/typescript.md

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,10 @@ import TabItem from '@theme/TabItem';
99

1010
React Navigation can be configured to type-check screens and their params, as well as various other APIs using TypeScript. This provides better intelliSense and type safety when working with React Navigation.
1111

12+
:::note
13+
React Navigation is designed to work with [`strict`](https://www.typescriptlang.org/tsconfig/#strict) mode in TypeScript. If you are not using `strict` mode, some things might not work as expected.
14+
:::
15+
1216
<Tabs groupId="config" queryString="config">
1317
<TabItem value="static" label="Static" default>
1418

@@ -187,6 +191,12 @@ The type containing the mapping must be a type alias (e.g. `type RootStackParamL
187191

188192
:::
189193

194+
If you have an [`id`](./navigator.md#id) prop for your navigator, you will also need to pass it as a generic:
195+
196+
```tsx
197+
const RootStack = createStackNavigator<RootStackParamList, 'MyStack'>();
198+
```
199+
190200
## Type checking screens
191201

192202
To typecheck our screens, we need to annotate the `navigation` and the `route` props received by a screen. The navigator packages in React Navigation export generic types to define types for both the `navigation` and `route` props from the corresponding navigator.
@@ -211,7 +221,7 @@ The type takes 3 generics:
211221
- The name of the route the screen belongs to
212222
- The ID of the navigator (optional)
213223

214-
If you have an `id` prop for your navigator, you can do:
224+
If you have an [`id`](./navigator.md#id) prop for your navigator, you can do:
215225

216226
```ts
217227
type Props = NativeStackScreenProps<RootStackParamList, 'Profile', 'MyStack'>;

0 commit comments

Comments
 (0)