栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > 后端开发 > Java

RN:React Native原理以及新架构JSI、Fabric等概念

Java 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

RN:React Native原理以及新架构JSI、Fabric等概念

说明

RN需要一个JS的运行环境, 在IOS上直接使用内置的javascriptcore, 在Android 则使用webkit.org官方开源的jsc.so。 此外还集成了其他开源组件,如fresco图片组件,okhttp网络组件等。

RN 会把应用的JS代码(包括依赖的framework)编译成一个js文件(一般命名为index.android.bundle), , RN的整体框架目标就是为了解释运行这个js 脚本文件,如果是js 扩展的API, 则直接通过bridge调用native方法; 如果是UI界面, 则映射到virtual DOM这个虚拟的JS数据结构中,通过bridge 传递到native , 然后根据数据属性设置各个对应的真实native的View。

从入口代码开始分析

入口文件:

import { AppRegistry } from 'react-native';
AppRegistry.registerComponent('wiseDerma', () => App);

这样,js 就在 app 端注册好了,接着就等待Native事件驱动渲染JS端定义的APP组件。

通信机制 JS调用java

java部分:
只需要在函数上加上ReactMethod注解就可以了

js部分:
JS调用java 使用通过扩展模块require(‘NativeModules’)获取native模块,然后直接调用native公开的方法

var { NativeModules } = require('react-native');
NativeModules.initialize

JS 调用require(‘NativeModules’)实际上是获取MessageQueue里面的一个native模块列表的属性。

java调用JS

未完待续…

参考资料

https://cloud.tencent.com/developer/article/1751479
https://cloud.tencent.com/developer/article/1036325

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/737499.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号