Skip to content

Commit 7a48f9d

Browse files
committed
Update compat layer docs
1 parent bcc4c5a commit 7a48f9d

File tree

1 file changed

+20
-2
lines changed

1 file changed

+20
-2
lines changed

docs/compatibility.md

Lines changed: 20 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ title: Compatibility layer
44
sidebar_label: Compatibility layer
55
---
66

7+
> **NOTE**: Before following this guide, make sure that you've followed the [Getting Started](getting-started.html) guide to setup React Navigation 5 in your app.
8+
79
React Navigation 5 has a completely new API, so our old code using React Navigation 4 will no longer work with this version. We understand that this can be a lot of work, so we have made a compatibility layer to make this easier.
810

911
To use the compatibility layer, we need to install [`@react-navigation/compat`](https://github.com/navigation-ex/packages/compat):
@@ -34,10 +36,26 @@ Then we can make minimal changes in our code to use it:
3436
If you were importing actions from `react-navigation`, you need to change them to import from `@react-navigation/compat`:
3537

3638
```diff
37-
-import { SwitchActions } from 'react-navigation';
38-
+import { SwitchActions } from '@react-navigation/compat';
39+
-import { NavigationActions } from 'react-navigation';
40+
+import { NavigationActions } from '@react-navigation/compat';
3941
```
4042

43+
The library exports the following APIs:
44+
45+
- Actions:
46+
- `NavigationActions`
47+
- `StackActions`
48+
- `DrawerActions`
49+
- `SwitchActions`
50+
- HOCs
51+
- `withNavigation`
52+
- `withNavigationFocus`
53+
- Navigators
54+
- `createSwitchNavigator`
55+
- Compatibility helpers
56+
- `createCompatNavigatorFactory` - Takes a navigator with the v5 API and returns a `createXNavigator` with the v4 API.
57+
- `createCompatNavigationProp` - Takes the v5 `navigation` object along with a `route` object and returns a v4 `navigation` object.
58+
4159
### What does it handle?
4260

4361
The compatibility layer handles various API differences between React Navigation 4 and 5:

0 commit comments

Comments
 (0)