@react-navigation/stack 与 @react-navigation/native-stack 有什么区别?

问题描述 投票:0回答:3

@react-navigation/stack@react-navigation/native-stack 有什么区别?

@react-navigation/stack 仅适用于 React 应用程序,@react-navigation/native-stack 仅适用于 React Native 应用程序吗?

  • @react-navigation/stack - 每周下载 301,111 次
  • @react-navigation/native-stack - 每周下载 24,830 次
import { createStackNavigator } from '@react-navigation/stack'
const Stack = createStackNavigator()
import { createNativeStackNavigator } from '@react-navigation/native-stack'
const Stack = createNativeStackNavigator()
reactjs react-native react-navigation
3个回答
53
投票

Native Stack 使用 Android 和 IOS 本机导航系统在页面之间导航。

本机堆栈导航器 https://reactnavigation.org/docs/native-stack-navigator/

堆栈导航器 https://reactnavigation.org/docs/stack-navigator/

另一个并不真正“导航”,而是模仿 JavaScript 和通用视图中的导航(有点像“单页应用程序”网络应用程序模仿网络导航的方式)。他们说他们试图让它感觉像本机导航,但它可能不完全相同或性能不高。然而,它将更加可定制。您可以自定义页面之间的转换。使用本机方法,定制很多东西是不切实际甚至不可能的。您可以自定义的内容,您需要为每个操作系统(Android、IOS)执行一次,除非导航库提供了一种自定义您想要的内容并处理操作系统差异的方法。


通常当人们想要制作跨平台应用程序时。只要明智,他们就会倾向于基于 JavaScript 的解决方案。仅在绝对必要时才使用本机方法。 React Native 让您能够利用本机 api,这真是太棒了。但是使用本机方法迫使您还使用物理手机(或模拟器)来(正确地)测试这些功能。而基于网络的所有内容都可以在浏览器中轻松测试,这往往会加快开发速度。


9
投票

从文档中,突出显示了最重要的事情:

此导航器在 iOS 上使用本机 API UINavigationController,在 Android 上使用 Fragment,因此使用 createNativeStackNavigator 构建的导航将与在这些 API 之上本机构建的应用程序的行为完全相同,并具有相同的性能特征。它还使用react-native-web 提供基本的Web 支持。

需要记住的一件事是,虽然 @react-navigation/native-stack 提供本机性能并公开本机功能,例如 iOS 上的大标题等,但它可能不像 @react-navigation/stack 那样可定制,具体取决于根据您的需要。因此,如果您需要比此导航器中更多的自定义功能,请考虑使用 @react-navigation/stack - 这是一个更可自定义的基于 JavaScript 的实现。 来源:https://reactnavigation.org/docs/stack-navigator/

虽然 React 和

React Native

0
投票

以下是对几个重要区别的更全面的描述:

组件:HTML 是编写 React 最常用的语法 成分。 React Native 中的组件是使用 JSX 构建的,即 HTML 和 JavaScript 的组合。

  • 渲染:React 使用虚拟 DOM 渲染组件。这意味着每当应用程序的状态发生变化时,React 都会更新虚拟 DOM 并创建真实 DOM 的轻量级副本。然后,React 会以高效的方式修改真实 DOM,以响应虚拟 DOM 的变化。 React Native 使用本机 API 渲染组件。因此,React Native 绕过 DOM,直接将组件渲染到屏幕上。

  • 样式:使用 CSS 来响应样式组件。 React Native 使用样式表设计其组件。虽然样式表通常是用 CSS 创建的,但也可以使用替代编程语言,例如 Sass 或 LESS。

  • React 使用 React Router 在应用程序内进行网页间导航。使用集成到 React Native 中的导航器库,可以在应用程序内的显示之间导航。

  • 最适合您需求的库是一个决定因素。在开发 Web 应用程序时,React 是一个很好的选择。在开发应在多个平台上运行的移动应用程序时,React Native 是一个可行的选择。

© www.soinside.com 2019 - 2024. All rights reserved.