使用 react-native-web 实现组件

Posted 2023-02-21

【中文标题】使用 react-native-web 实现组件

【英文标题】：Implementing components with react-native-web

【发布时间】：2016-09-22 15:08:18

【问题描述】：

我使用react-native-web 来拥有不仅可以在移动设备上使用，还可以在网络浏览器中使用的组件。我对这个想法的理解很简单：为常规的 react-native 组件提供基于 html 的实现。

如果我对库的理解正确，它可以通过使用 webpack 覆盖包来工作：

// webpack.config.js

module.exports = 
    ...
    resolve: 
        alias: 
            'react-native': 'react-native-web'
        
    
;

但是如果我想为 react-native-web 没有实现的组件提供实现呢？以及如何为react-native-button 等外部包提供实现。

【参考方案1】：

像react-native-button 这样的包只是使用 React Native 的 API 的代码集合。如果您加载 react-native-web 作为原始实现的替代，第三方包可能“正常工作”。效果如何取决于react-native-web 的 API 实现是否完整。

请注意，某些第三方 React Native 包包含 react-native-web 不打算实现的特定非 javascript 代码（ios/android 原生代码）。如果包文档说您需要运行 react-native link 或更改您的 Xcode/Android Studio 项目配置，则它可能不适用于 react-native-web。