跳到主要内容

术语表

开发者菜单

应用内开发者菜单(在开发构建版本中可用),提供对各种开发和调试操作的访问。 在文档中了解更多关于开发者菜单的信息

Fabric 渲染器

React Native 执行与 React for web 相同的 React 框架代码。然而,React Native 渲染到通用平台视图(宿主视图)而不是 DOM 节点(可以被视为 Web 的宿主视图)。Fabric 渲染器使得渲染到宿主视图成为可能。Fabric 让 React 能够与每个平台进行通信并管理其宿主视图实例。Fabric 渲染器存在于 JavaScript 中,并以 C++ 代码提供的接口为目标。 阅读这篇博文,了解更多关于 React 渲染器的信息。

宿主平台

嵌入 React Native 的平台(例如,Android、iOS、macOS、Windows)。

宿主视图树(和宿主视图)

宿主平台(例如 Android、iOS)中视图的树状表示。在 Android 上,宿主视图是 android.view.ViewGroupandroid.widget.TextView 等的实例,它们是宿主视图树的构建块。每个宿主视图的大小和位置基于 Yoga 计算的 LayoutMetrics,每个宿主视图的样式和内容基于 React Shadow Tree 的信息。

JavaScript 接口 (JSI)

一个轻量级的 API,用于将 JavaScript 引擎嵌入到 C++ 应用程序中。Fabric 使用它来在 Fabric 的 C++ 核心与 React 之间进行通信。

Java Native Interface (JNI)

一个 用于编写 Java 原生方法的 API,用于在 Fabric 的 C++ 核心与用 Java 编写的 Android 之间进行通信。

React 组件

一个 JavaScript 函数或类,用于指示如何创建 React Element。 阅读这篇博文,了解更多关于 React 组件和元素的信息。

React 复合组件

具有 render 实现的 React 组件,这些实现会归约到其他 React 复合组件或 React 宿主组件。

React 宿主组件或宿主组件

其视图实现由宿主视图提供的 React 组件(例如,<View>, <Text> )。在 Web 上,ReactDOM 的宿主组件将是像 <p><div> 这样的组件。

React Element 树(和 React Element)

React Element 树 由 React 在 JavaScript 中创建,并由 React Elements 组成。React Element 是一个普通的 JavaScript 对象,它描述了屏幕上应该显示的内容。它包括 props、样式和子项。React Elements 只存在于 JavaScript 中,并且可以表示 React 复合组件或 React 宿主组件的实例化。 阅读这篇博文,了解更多关于 React 组件和元素的信息。

React Native 框架

React Native 允许开发者使用 React 编程范式 将应用程序发布到原生目标。React Native 团队专注于创建适合开发原生应用程序时最通用用例的核心 API功能

将原生应用程序发布到生产环境通常需要一套工具和库,这些工具和库默认不随 React Native 提供,但对于发布应用程序到生产环境仍然至关重要。此类工具的例子有:支持将应用程序发布到专用商店或支持路由和导航机制。

当这些工具和库被收集起来,形成一个建立在 React Native 之上的、协调一致的框架时,我们就称之为React Native 框架

一个开源 React Native 框架的例子是 Expo

React Shadow 树(和 React Shadow Node)

React Shadow 树 由 Fabric 渲染器创建,并由 React Shadow Nodes 组成。React Shadow Node 是一个表示要挂载的 React Host Component 的对象,并包含源自 JavaScript 的 props。它们还包含布局信息(x、y、width、height)。在 Fabric 中,React Shadow Node 对象存在于 C++ 中。在 Fabric 之前,这些存在于移动运行时堆中(例如 Android JVM)。

Yoga 树(和 Yoga Node)

Yoga 树Yoga 使用,用于计算 React Shadow Tree 的布局信息。每个 React Shadow Node 通常会创建一个Yoga Node,因为 React Native 使用 Yoga 来计算布局。然而,这不是硬性要求。Fabric 也可以创建不使用 Yoga 的 React Shadow Nodes;每个 React Shadow Node 的实现决定了如何计算布局。