react-native - 如何在 Expo 应用中集成 react-native-linear-gradient

Question

我是 React Native 的新手，我面临着使用渐变的巨大挑战。

我的目标是创建一个组件库，它将在其他 React Native 应用程序中重复使用，并且我的一些组件采用渐变样式。例如，主要的 Button 组件具有渐变背景。

一些著名的解决方案是 react-native-linear-gradient和 Expo Linear Gradient ，但问题是它们似乎都不是组件库的通用解决方案:

• 如果我使用 react-native-linear-gradient，它不会在 Expo 项目中运行(我的组件的文档基于 Expo)。它以 Invariant Violation: requireNativeComponent: "BVLinearGradient"was not found in the UIManager. 中断。我需要说的是，我研究了这个问题但没有任何效果 - 我什至弹出了 Expo 配置、安装了 pod 等，但问题仍然存在。
• 如果我使用 Expo 线性渐变模块，它需要完整的 Expo 环境。

通常是否可以创建这样的具有渐变样式的组件库，以便在各种 React Native 环境中无缝运行？

我使用 webpack 来构建我的库，如果这可以为​​问题提供更多细节的话。

Answer 1

我为这个问题找到的解决方案是让我的 Button 接收平台特定的渐变组件作为 Prop 。上述两个库的样式方法是相同的，所以这对我的情况非常有用:

{/* LinearGradient is either Expo gradient or react-native-linear-gradient  */}
<Button GradientComponent={LinearGradient}> 
 ...
</Button>