使用 expo kit 在 react native 中加载自定义原生组件

Load custom native component in react native using expo kit(使用 expo kit 在 react native 中加载自定义原生组件)

本文介绍了使用 expo kit 在 react native 中加载自定义原生组件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试加载自定义 Android WebView 以便能够使用 html 文件输入上传文件(默认情况下,Android webview 不会与输入文件一起使用).

总结问题是我的自定义原生组件没有被 React Native 读取.有人可以帮帮我吗?

解决方案

Expo 默认不支持任何自定义原生模块.这是因为它们只有一个 perbuilt 二进制文件,并且只加载您编写的 JS 包.因此,您使用 Expo 编写的任何代码都只能是纯 Javascript.但是 Expo 文档确实说您可以在分离后添加自定义本机模块.更多信息在这里:

https://docs.expo.io/版本/最新/指南/detach.html#should-i-detach

https://docs.expo.io/versions/latest/introduction/faq.html#what-is-the-difference-between-expo-and-react-native

https://github.com/expo/expo/issues/56

Im trying to load a custom Android WebView to be able to upload files using html file inputs (by default Android webview wont work with input file). Im using this code, the only difference is that im using expo kit, so my MainApplication.java is different (inherits from another class by default):

public class MainApplication extends MultiDexApplication {

    // Needed for `react-native link`
    public List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
        new MainReactPackage(),
        new CustomWebViewPackage()
    );
  }

  @Override
  public void onCreate() {
      super.onCreate();
      SoLoader.init(this, /* native exopackage */ false);
  }
}

Basically what the git code do is override the default react native webview to make it use the CustomWebView.java in Android, using requireNativeComponent with this code (this is on CustomWebView.android.js):

var RCTWebView = requireNativeComponent('CustomWebView', WebView, {
nativeOnly: {
    messagingEnabled: PropTypes.bool,
},

});

But when i run the application using exp start and navigate to the screen that has the CustomWebView i receive this error:

Summarizing the problem is that my custom native component is not being read by React Native. Can someone help me please?

解决方案

Expo by default will not support any custom native modules. This is because they have a single perbuilt binary and they only load the JS bundle that you write. So any code you write with Expo can only be pure Javascript. But Expo documentation does say that you can add custom native modules after detaching. More info here:

https://docs.expo.io/versions/latest/guides/detach.html#should-i-detach

https://docs.expo.io/versions/latest/introduction/faq.html#what-is-the-difference-between-expo-and-react-native

https://github.com/expo/expo/issues/56

这篇关于使用 expo kit 在 react native 中加载自定义原生组件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本文标题为:使用 expo kit 在 react native 中加载自定义原生组件