<!-- mobian-agent-page publisher="dailydev" canonical="https://daily.dev/posts/react-navigation-2-0-ym5ocqfyp" -->

---
title: React Navigation 2.0 | daily.dev
description: React Navigation 2.0 ships with several significant and trivial breaking changes plus deprecations for React Native developers. The navigate() method now...
canonical: https://daily.dev/posts/react-navigation-2-0-ym5ocqfyp
twitter:card: summary_large_image
twitter:site: @dailydotdev
og:type: website
og:site_name: daily.dev
og:title: React Navigation 2.0 | daily.dev
og:description: React Navigation 2.0 ships with several significant and trivial breaking changes plus deprecations for React Native developers. The navigate() method now...
og:url: https://daily.dev/posts/react-navigation-2-0-ym5ocqfyp
og:image: https://api.daily.dev/og/posts/yM5ocqfyP.png
og:image:alt: React Navigation 2.0
og:image:width: 1200
og:image:height: 630
og:locale: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# React Navigation 2.0

**[React Navigation](https://daily.dev/sources/react-navigation)** · 7 min read · 0 upvotes · 0 comments

## Summary

React Navigation 2.0 ships with several significant and trivial breaking changes plus deprecations for React Native developers. The navigate() method now behaves less like push(), reusing existing routes instead of always pushing; push() now propagates across nested routers; navigationOptions resolution is now shallow (only direct children are checked); and a new createNavigator API decouples navigation views from routers. Drawer routes are replaced with openDrawer()/closeDrawer()/toggleDrawer() actions, NavigationActions are split by router (StackActions, etc.), and XNavigator-style constructors (StackNavigator, TabNavigator, DrawerNavigator) are deprecated in favor of createStackNavigator, createTabNavigator, and createDrawerNavigator, to be removed in 3.0. TabNavigator is also split into createBottomTabNavigator and createMaterialTopTabNavigator. Additional enhancements include state persistence, keyboard-aware stack navigation, and a new createMaterialBottomTabNavigator.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://reactnavigation.org/blog/2018/05/07/react-navigation-2.0>

## Questions this post answers

### How does navigate() behave differently in React Navigation 2.0 compared to 1.x?

In React Navigation 2.0, calling navigate(routeName) first tries to find an existing instance of that route in the stack and jumps to it if found, instead of always pushing a new route as it did in 1.x. To force a new instance every time, use push(routeName) instead, or pass a unique key like navigate({routeName, key: data.uniqueId, params: data}).

_Track breaking navigation changes like this on daily.dev before they slow down a react navigation upgrade._

### Are StackNavigator, TabNavigator, and DrawerNavigator deprecated in React Navigation 2.0?

Yes, StackNavigator, TabNavigator, and DrawerNavigator are deprecated in React Navigation 2.0 in favor of createStackNavigator, createTabNavigator, and createDrawerNavigator, which are functionally identical but signal that they are functions returning components. The old XNavigator style is scheduled for removal in version 3.0.

_Developers planning a react navigation migration can follow deprecation timelines like this on daily.dev._

### How do I open a drawer navigator in React Navigation 2.0 instead of using navigate('DrawerOpen')?

Call navigation.openDrawer() directly instead of navigation.navigate('DrawerOpen'). Companion methods closeDrawer() and toggleDrawer() are also available on the navigation prop as of React Navigation 2.0, replacing the old drawer-route-based approach entirely.

_Keep migration snippets like this handy on daily.dev when updating a react navigation drawer setup._

## Similar posts on daily.dev

- [React Navigation 8.0 Alpha with Native Bottom Tabs, Reworked TypeScript Inference and History](https://daily.dev/posts/react-navigation-8-0-alpha-with-native-bottom-tabs-reworked-typescript-inference-and-history-baby9kbnm) · InfoQ · 6 upvotes · 1 comments
- [React Navigation 8.0 - July Progress Report](https://daily.dev/posts/react-navigation-8-0---july-progress-report-zwpb6nosh) · React Navigation · 7 upvotes · 2 comments
- [Less Boilerplate, More Type Safety: React Navigation 8's Typed Hooks](https://daily.dev/posts/less-boilerplate-more-type-safety-react-navigation-8-s-typed-hooks-kriqcazi2) · Callstack Blog · 1 upvotes · 0 comments
- [Building balanced mobile layouts: nesting tabs and drawers with Expo Router](https://daily.dev/posts/building-balanced-mobile-layouts-nesting-tabs-and-drawers-with-expo-router-rtwziriwn) · Expo Blog · 8 upvotes · 1 comments

---

Tags: [#javascript](https://daily.dev/tags/javascript), [#react](https://daily.dev/tags/react), [#architecture](https://daily.dev/tags/architecture), [#react-native](https://daily.dev/tags/react-native)

[View this post on daily.dev](https://daily.dev/posts/react-navigation-2-0-ym5ocqfyp)

```json
{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]}
{"@context":"https://schema.org","@type":"TechArticle","headline":"React Navigation 2.0","url":"https://daily.dev/posts/react-navigation-2-0-ym5ocqfyp","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/react-navigation-2-0-ym5ocqfyp"},"datePublished":"2026-08-23T12:22:16.711Z","dateModified":"2026-08-23T12:43:56.767Z","description":"React Navigation 2.0 ships with several significant and trivial breaking changes plus deprecations for React Native developers. The navigate() method now...","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/2cb5a266a09c2095f5194cd07eb12a75?_a=AQAEuop","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/2cb5a266a09c2095f5194cd07eb12a75?_a=AQAEuop","isAccessibleForFree":true,"articleSection":"React Navigation","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"React Navigation","logo":"https://media.daily.dev/image/upload/s--d1x9LTh1--/c_limit,w_256/f_auto,q_auto/v1787487486/logos/react-navigation?_a=BAMAMicg0","url":"https://daily.dev/sources/react-navigation"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/react-navigation-2-0-ym5ocqfyp","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":0},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"javascript,react,architecture,react-native","timeRequired":"PT7M"}
{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"React Navigation","item":"https://daily.dev/sources/react-navigation"},{"@type":"ListItem","position":3,"name":"React Navigation 2.0"}]}
{"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/react-navigation-2-0-ym5ocqfyp#faq","mainEntity":[{"@type":"Question","name":"How does navigate() behave differently in React Navigation 2.0 compared to 1.x?","acceptedAnswer":{"@type":"Answer","text":"In React Navigation 2.0, calling navigate(routeName) first tries to find an existing instance of that route in the stack and jumps to it if found, instead of always pushing a new route as it did in 1.x. To force a new instance every time, use push(routeName) instead, or pass a unique key like navigate({routeName, key: data.uniqueId, params: data}). Track breaking navigation changes like this on daily.dev before they slow down a react navigation upgrade."}},{"@type":"Question","name":"Are StackNavigator, TabNavigator, and DrawerNavigator deprecated in React Navigation 2.0?","acceptedAnswer":{"@type":"Answer","text":"Yes, StackNavigator, TabNavigator, and DrawerNavigator are deprecated in React Navigation 2.0 in favor of createStackNavigator, createTabNavigator, and createDrawerNavigator, which are functionally identical but signal that they are functions returning components. The old XNavigator style is scheduled for removal in version 3.0. Developers planning a react navigation migration can follow deprecation timelines like this on daily.dev."}},{"@type":"Question","name":"How do I open a drawer navigator in React Navigation 2.0 instead of using navigate('DrawerOpen')?","acceptedAnswer":{"@type":"Answer","text":"Call navigation.openDrawer() directly instead of navigation.navigate('DrawerOpen'). Companion methods closeDrawer() and toggleDrawer() are also available on the navigation prop as of React Navigation 2.0, replacing the old drawer-route-based approach entirely. Keep migration snippets like this handy on daily.dev when updating a react navigation drawer setup."}}]}
```

