Last weekend, when I was writing my year-end review, I had a new inspiration — actually, it was XXX.

Six months ago, in my post on How We built Cordova into React Native, I explained how to build Cordova into React Native.

Dore was written in response to the large number of Cordova apps that will migrate to React Native in the future.

Dore is a WebView container that uses the React Native implementation to call the React Native component in a WebView.

It is designed to transfer the WebView of Cordova to the React Native WebView.

Of course, there are still more plug-ins in development to train me in writing native code. I’ll be rewriting some Java, Objective-C native code and looking at Swift in the future.

Dore usage example

In a WebView, we can call cordova.plugins directly:

DoreClient.lockToLandscape(); DoreClient. SetBrightnessLevel (0.2); DoreClient.isTablet().then(function(data) {

});
Copy the code

React Native is also easy to use, calling Dore in the onMessage of the WebView.

onMessage = evt => {
  Dore.handleMessage(evt, this.webView)
};
Copy the code

Accordingly, only need to inject the corresponding native module, can call the native module of the third party — if we have already connected:

Dore.inject([{
  name: 'Toast',
  class: Toast
}
Copy the code

The following plug-ins are currently supported:

  • BackHandler (Android)
  • Badge (by react-native-icon-badge
  • Brightness (by the react – native – device – Brightness)
  • Console
  • Clipboard
  • DatePicker (iOS by react-native-notag-datepicker)
  • DeviceInfo (by react-native-device-info)
  • Geolocation
  • Keyboard
  • NetInfo
  • Orientation
  • Permissions (by react-native-permissions)
  • State
  • StatusBar
  • Toast (by dore-toast)
  • Vibration

There are other plug-ins waiting for you to develop.

Project address: github.com/phodal/dore