<!-- mobian-agent-page publisher="dailydev" canonical="https://daily.dev/posts/on-the-way-to-react-navigation-6-0-cyohpmkmq" -->

---
title: On the way to React Navigation 6.0 | daily.dev
description: React Navigation 6 has reached prerelease, keeping the same core API as version 5 but introducing breaking changes for consistency and flexibility. Notable...
canonical: https://daily.dev/posts/on-the-way-to-react-navigation-6-0-cyohpmkmq
twitter:card: summary_large_image
twitter:site: @dailydotdev
og:type: website
og:site_name: daily.dev
og:title: On the way to React Navigation 6.0 | daily.dev
og:description: React Navigation 6 has reached prerelease, keeping the same core API as version 5 but introducing breaking changes for consistency and flexibility. Notable...
og:url: https://daily.dev/posts/on-the-way-to-react-navigation-6-0-cyohpmkmq
og:image: https://api.daily.dev/og/posts/cyohpmKMQ.png
og:image:alt: On the way to React Navigation 6.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.

# On the way to React Navigation 6.0

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

## Summary

React Navigation 6 has reached prerelease, keeping the same core API as version 5 but introducing breaking changes for consistency and flexibility. Notable changes include params being overwritten instead of merged by default, iOS modals using native presentation style, new Android modal slide animation, drawer navigator using slide animation on iOS, headers shown by default in drawer and bottom tab screens, removal of tabBarOptions/drawerContentOptions in favor of per-screen options, a ViewPager-based Material Top Tabs implementation, and a new UI elements library. The team also plans to recommend native-stack as the default navigator going forward. Developers can try the prerelease by installing packages with the @^6.x tag.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://reactnavigation.org/blog/2021/03/12/react-navigation-6.0-next>

## Questions this post answers

### What breaking changes does React Navigation 6 introduce compared to version 5?

React Navigation 6 keeps the same API surface as version 5 but changes several defaults: navigation params are now overwritten instead of merged (with an option to merge), iOS modals in the stack navigator use the native presentation style by default, Android gets a new slide animation for modals, drawer navigation uses a slide animation on iOS, headers appear by default in drawer and bottom tab screens, and tabBarOptions/drawerContentOptions are removed in favor of per-screen options props.

_daily.dev helps React Native developers track breaking changes before they upgrade navigation libraries._

### How do I install the React Navigation 6 prerelease in my project?

Add the @^6.x tag when installing React Navigation packages, for example npm install @react-navigation/native@^6.x @react-navigation/stack@^6.x. The same pattern works with yarn, pnpm, or bun by appending @^6.x to each package name being installed.

_Developers testing prerelease libraries like this one can follow updates on daily.dev._

### Should I use native-stack or the JavaScript stack navigator in React Navigation?

Native-stack is planned to become the recommended default because it delivers the best performance for apps that don't need heavy customization, while the JavaScript-based stack implementation remains available for cases requiring more control over behavior and styling.

_daily.dev keeps developers deciding between navigation implementations informed on library direction._

## 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
- [Making React Native actually native](https://daily.dev/posts/making-react-native-actually-native-bdan1xdzt) · Bytes by ui.dev · 2 upvotes · 0 comments

---

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

[View this post on daily.dev](https://daily.dev/posts/on-the-way-to-react-navigation-6-0-cyohpmkmq)

```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":"On the way to React Navigation 6.0","url":"https://daily.dev/posts/on-the-way-to-react-navigation-6-0-cyohpmkmq","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/on-the-way-to-react-navigation-6-0-cyohpmkmq"},"datePublished":"2026-08-23T12:22:13.663Z","dateModified":"2026-08-23T12:54:04.899Z","description":"React Navigation 6 has reached prerelease, keeping the same core API as version 5 but introducing breaking changes for consistency and flexibility. Notable...","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/on-the-way-to-react-navigation-6-0-cyohpmkmq","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":0},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"react,mobile,react-native","timeRequired":"PT3M"}
{"@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":"On the way to React Navigation 6.0"}]}
{"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/on-the-way-to-react-navigation-6-0-cyohpmkmq#faq","mainEntity":[{"@type":"Question","name":"What breaking changes does React Navigation 6 introduce compared to version 5?","acceptedAnswer":{"@type":"Answer","text":"React Navigation 6 keeps the same API surface as version 5 but changes several defaults: navigation params are now overwritten instead of merged (with an option to merge), iOS modals in the stack navigator use the native presentation style by default, Android gets a new slide animation for modals, drawer navigation uses a slide animation on iOS, headers appear by default in drawer and bottom tab screens, and tabBarOptions/drawerContentOptions are removed in favor of per-screen options props. daily.dev helps React Native developers track breaking changes before they upgrade navigation libraries."}},{"@type":"Question","name":"How do I install the React Navigation 6 prerelease in my project?","acceptedAnswer":{"@type":"Answer","text":"Add the @^6.x tag when installing React Navigation packages, for example npm install @react-navigation/native@^6.x @react-navigation/stack@^6.x. The same pattern works with yarn, pnpm, or bun by appending @^6.x to each package name being installed. Developers testing prerelease libraries like this one can follow updates on daily.dev."}},{"@type":"Question","name":"Should I use native-stack or the JavaScript stack navigator in React Navigation?","acceptedAnswer":{"@type":"Answer","text":"Native-stack is planned to become the recommended default because it delivers the best performance for apps that don't need heavy customization, while the JavaScript-based stack implementation remains available for cases requiring more control over behavior and styling. daily.dev keeps developers deciding between navigation implementations informed on library direction."}}]}
```

