热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

关于RN与webview的简单通信

1.RN向webview传值,js页面importReact,{Component}fromreact;import{Text,View,WebView,Style

1.RN向webview传值,js页面

import React, { Component } from 'react';
import {Text,View,WebView,StyleSheet,AppRegistry,TouchableOpacity,
} from'react-native';
export default class MyWeb extends Component {constructor(props){super(props);this.state={webstring:''}}handleMessage(){const message = 'hello web 199!';this.webview.postMessage(message);//通过handleMessage向RN传递字符串Message,若写成ref="wbview",这里写成this.refs.webview.postMessage(message)}render(){return ({this.state.webstring}简单的网页{ this.webview = webview;}} //或者可以写成:ref="webview"source={require('./html/aa.html')}>);}
}
var styles =StyleSheet.create({webview:{backgroundColor:'#ffffff',}
});
html页面:







Click on the header to alert its value



2.webview向RN传值,js页面

import React, { Component } from 'react';
import {Text,View,WebView,StyleSheet,AppRegistry,TouchableOpacity,
} from'react-native';
export default class MyWeb extends Component {constructor(props){super(props);this.state={webstring:''}}render(){return ({this.state.webstring}简单的网页{ this.webview = webview;}}source={require('./html/aa.html')}onMessage={(event)=>{this.setState({webstring:event.nativeEvent.data})}}//通过这个函数接受webview传来的值>);}
}
var styles =StyleSheet.create({webview:{backgroundColor:'#ffffff',}
});
html页面:






This is a header


Click on the header to alert its value













推荐阅读
  • 近期尝试从www.hub.sciverse.com网站通过编程手段获取数据时遇到问题,起初尝试使用WebBrowser控件进行数据抓取,但发现使用GET方法翻页时,返回的HTML代码始终相同。进一步探究后了解到,该网站的数据是通过Ajax异步加载的,可通过HTTP查看详细的JSON响应。 ... [详细]
  • spring boot使用jetty无法启动 ... [详细]
  • 本文将从基础概念入手,详细探讨SpringMVC框架中DispatcherServlet如何通过HandlerMapping进行请求分发,以及其背后的源码实现细节。 ... [详细]
  • 深入理解:AJAX学习指南
    本文详细探讨了AJAX的基本概念、工作原理及其在现代Web开发中的应用,旨在为初学者提供全面的学习资料。 ... [详细]
  • publicclassBindActionextendsActionSupport{privateStringproString;privateStringcitString; ... [详细]
  • 本文介绍了如何通过C#语言调用动态链接库(DLL)中的函数来实现IC卡的基本操作,包括初始化设备、设置密码模式、获取设备状态等,并详细展示了将TextBox中的数据写入IC卡的具体实现方法。 ... [详细]
  • 使用TabActivity实现Android顶部选项卡功能
    本文介绍如何通过继承TabActivity来创建Android应用中的顶部选项卡。通过简单的步骤,您可以轻松地添加多个选项卡,并实现基本的界面切换功能。 ... [详细]
  • 本文介绍了SIP(Session Initiation Protocol,会话发起协议)的基本概念、功能、消息格式及其实现机制。SIP是一种在IP网络上用于建立、管理和终止多媒体通信会话的应用层协议。 ... [详细]
  • Requests库的基本使用方法
    本文介绍了Python中Requests库的基础用法,包括如何安装、GET和POST请求的实现、如何处理Cookies和Headers,以及如何解析JSON响应。相比urllib库,Requests库提供了更为简洁高效的接口来处理HTTP请求。 ... [详细]
  • Go从入门到精通系列视频之go编程语言密码学哈希算法(二) ... [详细]
  • 本文详细介绍了C++中的构造函数,包括其定义、特点以及如何通过构造函数进行对象的初始化。此外,还探讨了转换构造函数的概念及其在不同情境下的应用,以及如何避免不必要的隐式类型转换。 ... [详细]
  • 问题场景用Java进行web开发过程当中,当遇到很多很多个字段的实体时,最苦恼的莫过于编辑字段的查看和修改界面,发现2个页面存在很多重复信息,能不能写一遍?有没有轮子用都不如自己造。解决方式笔者根据自 ... [详细]
  • CentOS下ProFTPD的安装与配置指南
    本文详细介绍在CentOS操作系统上安装和配置ProFTPD服务的方法,包括基本配置、安全设置及高级功能的启用。 ... [详细]
  • Web动态服务器Python基本实现
    Web动态服务器Python基本实现 ... [详细]
  • 从CodeIgniter中提取图像处理组件
    本指南旨在帮助开发者在未使用CodeIgniter框架的情况下,如何独立使用其强大的图像处理功能,包括图像尺寸调整、创建缩略图、裁剪、旋转及添加水印等。 ... [详细]
author-avatar
手机用户2502877197
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有