Skip to content

Commit f6d409a

Browse files
committed
Emphasize type safety for useNavigation & useRoute
1 parent 1cb6653 commit f6d409a

File tree

2 files changed

+28
-8
lines changed

2 files changed

+28
-8
lines changed

versioned_docs/version-6.x/typescript.md

+14-4
Original file line numberDiff line numberDiff line change
@@ -209,24 +209,34 @@ type ProfileScreenNavigationProp = CompositeNavigationProp<
209209

210210
### Annotating `useNavigation`
211211

212+
:::danger
213+
214+
Annotating `useNavigation` isn't type-safe because the type parameter cannot be statically verified.
215+
Prefer [specifying a default type](#specifying-default-types-for-usenavigation-link-ref-etc) instead.
216+
217+
:::
218+
212219
To annotate the `navigation` prop that we get from `useNavigation`, we can use a type parameter:
213220

214221
```ts
215222
const navigation = useNavigation<ProfileScreenNavigationProp>();
216223
```
217224

218-
It's important to note that this isn't completely type-safe because the type parameter you use may not be correct and we cannot statically verify it.
219-
220225
### Annotating `useRoute`
221226

227+
:::danger
228+
229+
Annotating `useRoute` isn't type-safe because the type parameter cannot be statically verified.
230+
Prefer using the [`route` prop](route-prop.md) instead when possible. Use `useRoute` for generic code that doesn't need specific route type.
231+
232+
:::
233+
222234
To annotate the `route` prop that we get from `useRoute`, we can use a type parameter:
223235

224236
```ts
225237
const route = useRoute<ProfileScreenRouteProp>();
226238
```
227239

228-
It's important to note that this isn't completely type-safe, similar to `useNavigation`.
229-
230240
### Annotating `options` and `screenOptions`
231241

232242
When you pass the `options` to a `Screen` or `screenOptions` prop to a `Navigator` component, they are already type-checked and you don't need to do anything special. However, sometimes you might want to extract the options to a separate object, and you might want to annotate it.

versioned_docs/version-7.x/typescript.md

+14-4
Original file line numberDiff line numberDiff line change
@@ -209,24 +209,34 @@ type ProfileScreenNavigationProp = CompositeNavigationProp<
209209

210210
### Annotating `useNavigation`
211211

212+
:::danger
213+
214+
Annotating `useNavigation` isn't type-safe because the type parameter cannot be statically verified.
215+
Prefer [specifying a default type](#specifying-default-types-for-usenavigation-link-ref-etc) instead.
216+
217+
:::
218+
212219
To annotate the `navigation` prop that we get from `useNavigation`, we can use a type parameter:
213220

214221
```ts
215222
const navigation = useNavigation<ProfileScreenNavigationProp>();
216223
```
217224

218-
It's important to note that this isn't completely type-safe because the type parameter you use may not be correct and we cannot statically verify it.
219-
220225
### Annotating `useRoute`
221226

227+
:::danger
228+
229+
Annotating `useRoute` isn't type-safe because the type parameter cannot be statically verified.
230+
Prefer using the [`route` prop](route-prop.md) instead when possible. Use `useRoute` for generic code that doesn't need specific route type.
231+
232+
:::
233+
222234
To annotate the `route` prop that we get from `useRoute`, we can use a type parameter:
223235

224236
```ts
225237
const route = useRoute<ProfileScreenRouteProp>();
226238
```
227239

228-
It's important to note that this isn't completely type-safe, similar to `useNavigation`.
229-
230240
### Annotating `options` and `screenOptions`
231241

232242
When you pass the `options` to a `Screen` or `screenOptions` prop to a `Navigator` component, they are already type-checked and you don't need to do anything special. However, sometimes you might want to extract the options to a separate object, and you might want to annotate it.

0 commit comments

Comments
 (0)