Skip to content

Commit 61b0951

Browse files
authored
docs(navigation): Use createNavigationContainerRef instead of React.useRef (#14299)
## DESCRIBE YOUR PR This PR fixes an incorrect example in the documentation where `React.useRef()` was used with `NavigationContainer`. React Navigation requires using `createNavigationContainerRef()` instead of `React.useRef()` to ensure proper access to navigation methods from outside React components. This change ensures consistency with React Navigation's official recommendation and prevents potential issues when performing programmatic navigation. Fixes: N/A --- ## IS YOUR CHANGE URGENT? Help us prioritize incoming PRs by letting us know when the change needs to go live. - [x] None: Not urgent, can wait up to 1 week+ - [ ] Urgent deadline (GA date, etc.): <!-- ENTER DATE HERE --> - [ ] Other deadline: <!-- ENTER DATE HERE --> --- ## SLA - Teamwork makes the dream work, so please add a reviewer to your PRs. - Please give the docs team up to 1 week to review your PR unless you've added an urgent due date to it. Thanks in advance for your help! --- ## PRE-MERGE CHECKLIST *Make sure you've checked the following before merging your changes:* - [ ] Checked Vercel preview for correctness, including links - [ ] PR was reviewed and approved by any necessary SMEs (subject matter experts) - [ ] PR was reviewed and approved by a member of the [Sentry docs team](https://github.com/orgs/getsentry/teams/docs) --- ## LEGAL BOILERPLATE <!-- Sentry employees and contractors can delete or ignore this section. --> Look, I get it. The entity doing business as "Sentry" was incorporated in the State of Delaware in 2015 as Functional Software, Inc. and is gonna need some rights from me in order to utilize my contributions in this here PR. So here's the deal: I retain all rights, title and interest in and to my contributions, and by keeping this boilerplate intact I confirm that Sentry can use, modify, copy, and redistribute my contributions, under Sentry's choice of terms. --- ## EXTRA RESOURCES - [Sentry Docs contributor guide](https://docs.sentry.io/contributing/)
1 parent 4f22e9a commit 61b0951

File tree

1 file changed

+3
-3
lines changed

1 file changed

+3
-3
lines changed

includes/react-native-react-navigation-setup.mdx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
```jsx {5, 20} {tabTitle: Functional Components}
22
import * as Sentry from "@sentry/react-native";
3-
import { NavigationContainer } from "@react-navigation/native";
3+
import { NavigationContainer, createNavigationContainerRef } from "@react-navigation/native";
44

55
const navigationIntegration = Sentry.reactNavigationIntegration({
66
enableTimeToInitialDisplay: true,
@@ -12,7 +12,7 @@ Sentry.init({
1212
})
1313

1414
function App = () => {
15-
const containerRef = React.useRef();
15+
const containerRef = createNavigationContainerRef();
1616

1717
return (
1818
<NavigationContainer
@@ -39,7 +39,7 @@ Sentry.init({
3939
})
4040

4141
class App extends React.Component {
42-
containerRef = React.createRef();
42+
containerRef = createNavigationContainerRef();
4343

4444
render() {
4545
return (

0 commit comments

Comments
 (0)