原生模块简介
原生模块和原生组件是我们稳定技术,由旧架构使用。它们将在未来被弃用,届时新架构将变得稳定。新架构使用 Turbo 原生模块 和 Fabric 原生组件 来实现类似的结果。
有时 React Native 应用程序需要访问 JavaScript 默认情况下不可用的原生平台 API,例如访问 Apple 或 Google Pay 的原生 API。也许您想重用一些现有的 Objective-C、Swift、Java 或 C++ 库,而无需在 JavaScript 中重新实现它们,或者编写一些高性能的多线程代码,例如图像处理。
NativeModule 系统将 Java/Objective-C/C++(原生)类的实例暴露给 JavaScript(JS)作为 JS 对象,从而允许您从 JS 中执行任意原生代码。虽然我们不希望此功能成为常规开发流程的一部分,但它的存在至关重要。如果 React Native 没有导出您的 JS 应用程序所需的原生 API,您应该能够自己导出它!
原生模块设置
有两种方法可以为您的 React Native 应用程序编写原生模块
- 直接在您的 React Native 应用程序的 iOS/Android 项目中
- 作为 NPM 包,可以作为您的/其他 React Native 应用程序的依赖项安装
本指南将首先引导您完成直接在 React Native 应用程序中实现原生模块的过程。但是,您在以下指南中构建的原生模块可以作为 NPM 包进行分发。如果您有兴趣这样做,请查看 将原生模块设置为 NPM 包 指南。
入门
在以下部分中,我们将引导您完成有关如何在 React Native 应用程序中直接构建原生模块的指南。作为先决条件,您将需要一个 React Native 应用程序来进行操作。如果您还没有,可以按照 此处 的步骤设置 React Native 应用程序。
假设您想从 React Native 应用程序中的 JavaScript 访问 iOS/Android 原生日历 API 以创建日历事件。React Native 不会公开与原生日历库通信的 JavaScript API。但是,通过原生模块,您可以编写与原生日历 API 通信的原生代码。然后,您可以在 React Native 应用程序中的 JavaScript 中调用该原生代码。