前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Dore 混合应用框架 —— 基于 React Native 的混合应用迁移方案

Dore 混合应用框架 —— 基于 React Native 的混合应用迁移方案

作者头像
Phodal
发布2018-01-24 17:57:16
1.7K0
发布2018-01-24 17:57:16
举报
文章被收录于专栏:phodalphodal

上个周末,在写我的年终总结,有了一点新灵感 —— 其实是 xxx 原因。

在半年前的那篇《我们是如何将 Cordova 应用嵌入到 React Native 中》中,我介绍了如何将 Cordova 嵌入 React Native 应用中。

考虑到有大量的 Cordova 应用,会在未来迁移到 React Native 中,便写了 Dore。

Dore 是一个使用 React Native 实现的 WebView 容器,可以让你在 WebView 调用 React Native 组件。

其设计初衷:用于迁移 Cordova 的 WebView 应用到 React Native 的 WebView。

当然,仍然有更多的插件在开发之中,为了训练一下我编写原生代码的能力。我将改写一些 Java、Objective-C 的原生代码,未来会考虑使用 Swift。

Dore 使用示例

在 WebView 里,我们可以直接调用,类似于 cordova.plugins:

代码语言:javascript
复制
DoreClient.lockToLandscape();DoreClient.setBrightnessLevel(0.2);DoreClient.isTablet().then(function(data) {});

在 React Native 使用起来也比较简单,在 WebView 的 onMessage 调用 Dore。

代码语言:javascript
复制
onMessage = evt => {  Dore.handleMessage(evt, this.webView)};

对应的,只需要注入相应的原生模块,就可以调用第三方的原生模块——前提是我们已经对接了:

代码语言:javascript
复制
Dore.inject([{  name: 'Toast',  class: Toast}

当前支持以下的插件:

  • BackHandler (Android)
  • Brightness (by react-native-device-brightness)
  • Console
  • DeviceInfo (by react-native-device-info)
  • Geolocation
  • Keyboard
  • NetInfo
  • Orientation
  • Permissions (by react-native-permissions)
  • State
  • StatusBar
  • Toast (by dore-toast)
  • Vibration

还有其它插件,等着你来一起开发。

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2017-12-19,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 phodal 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • Dore 使用示例
相关产品与服务
容器服务
腾讯云容器服务(Tencent Kubernetes Engine, TKE)基于原生 kubernetes 提供以容器为核心的、高度可扩展的高性能容器管理服务,覆盖 Serverless、边缘计算、分布式云等多种业务部署场景,业内首创单个集群兼容多种计算节点的容器资源管理模式。同时产品作为云原生 Finops 领先布道者,主导开源项目Crane,全面助力客户实现资源优化、成本控制。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档