在React.js和React Native应用程序之间重复使用代码

问题描述：

我想重复使用一些从两个应用程序的API中检索数据的代码。一个是使用React Native的iOS应用程序。另一个是使用React.js的网站。在React.js和React Native应用程序之间重复使用代码

我最初编写了从我的API应用程序中检索数据的类。因此，我使用了React Native中的fetch方法。

不幸的是，React.js中没有这样的方法。如果我想重用我的代码，我最好的选择是通过创建类HTTPRequests来抽象React Native的fetch方法的调用，方法fetch将调用React Native的fetch方法或'$ .get'方法，具体取决于项目使用的库：React.js或React Native。

我的问题如下：如何检测我的项目中使用React.js或React Native。我的第一个想法是检测我的JS代码是否通过RCTRootView引擎或浏览器执行。但我不知道如何做到这一点。

有什么建议吗？

谢谢！

有一些库在浏览器中实现了获取API，例如：https：//github.com/github/fetch。 –

答

我的建议是将共享逻辑移动到单独的模块（bower，npm，ES6）中，通过获取polyfill来概括您请求数据的方式，并且永远不会在您的项目中检测到React/React.native。当新版本的React/React.native出现时，JS代码检测将使您的代码变得复杂且难以支持。

是的，你是对的。我终于设法不必根据我使用的库创建两个案例。 –

我很好奇你如何创建共享文件？你使用browserify？ –

@AndyB我的经验法则是一个单独的npm包，你甚至可以在你的package.json中使用本地依赖https://docs.npmjs.com/files/package.json#local-paths与npm 2.0，我会还建议linklocal包的开发使用 –

答

我有使用React Native的platform-specific extensions功能使用React和React Native构建跨平台应用程序的成功经验。我刚才描述了如何在博客文章中实现代码结构Code sharing between React and React Native applications

在React.js和React Native应用程序之间重复使用代码

相关推荐