在 React Web 应用程序和 React Native 应用程序之间共享应用程序逻辑，同时保持每个平台独有的单个组件呈现是可能的！

在我看来，这是一个很好的选择。我会给你一个方法的概述和一些建议。

在理想的世界中，我们将能够共享 100% 的代码。据我所知，这是不可能的，但我们仍然可以共享很多代码。虽然 React Native 和 React 很像，但是需要注意的是渲染代码是不同的。取而代之的是像<div>or 之类的 web 东西<span>，你使用 React Native 组件，比如<View>,<Text>和其他内置组件。

然而，在大多数情况下，业务逻辑只是 JavaScript，这是我们可以分享的重要内容之一！

计划

基于您使用的 Flux 架构，这意味着您的存储、reducer、动作将是共享代码，以及大多数业务逻辑（内部服务或其他）以及常量和实用程序。

然后将使用 React Native 专门为每个原生平台编写 UI 层，使用 React 为 Web 编写。不仅因为需要用 React Native 组件替换 HTML 元素，还因为这些组件在移动应用程序上可能会有非常不同的行为。

一些一般准则/建议

• 考虑一个好的架构和代码结构，以便尽可能多地共享代码（和应用程序逻辑）。尝试分离 UI 呈现组件（每个平台会有所不同）。

• 查看React Native 文档中的JavaScript 环境细节。使用 React Native 时，您将在两种环境中运行 JavaScript 代码：

  • 在 iOS 模拟器和设备、Android 模拟器和设备上。React Native 使用 JavaScriptCore，它是支持 Safari 的 JavaScript 引擎。在 iOS 上 JSC 不使用 JIT，因为 iOS 应用程序中没有可写的可执行内存。
  • 使用 Chrome 调试时，它会运行 Chrome 本身内的所有 JavaScript 代码，并通过 WebSocket 与本机代码进行通信。所以你使用的是 V8。

  虽然这两种环境非常相似，但您最终可能会遇到一些不一致之处。

• 考虑共享代码的不同策略。为了访问共享代码，您正在构建的应用程序不必都位于相同的代码库或 git 存储库中。

  更现实的是，您将有两个或多个单独托管的项目，因此 npm 包是在它们之间共享代码的最简单方法之一。

  这很容易制作一个新包并将其设置为每个项目中的依赖项。对于共享项目的路径，您可以使用 git 存储库而不是指向 npm 上的公共包。

  即使您现在只构建 Web 应用程序，您也可以花一些时间思考如何泛化某些共享代码，以便将来更轻松地重用它。

这是可能且可行的。您必须为每个平台 (web/android/ios) 提供一个视图，因为每个平台都有您的组件。

业务逻辑必须在视图之外。使用 Flux 可以使您的项目与原生轻松，因为它将 api 交互移动到数据层，让视图只是一个视图。