DeviceEventEmitter React-Native 发送和接受消息(事件监听器)
A页面注册通知:
import {DeviceEventEmitter} from 'react-native';
//…
//调用事件通知
DeviceEventEmitter.emit('xxxName',param);
//xxxName:通知的名称 param:发送的消息(传参)
B页面接收通知:
componentDidMount(){
var self = this;
this.listener =DeviceEventEmitter.addListener('xxxName',function(param){
// use param do something
});
}
//xxxName:通知的名称 param:接收到的消息(传参)
componentWillUnmount(){
this.listener.remove();
}
//在componentWillUnmount 内需要我们手动移除通知
我的页面在获取到用户数据后:
//注册监听事件,时间名称:changeMine 传参:jsonData.avatar(头像url)
DeviceEventEmitter.emit('changeMine',jsonData.avatar);
tabbar.js文件
componentDidMount(){
var self = this;
this.listener = DeviceEventEmitter.addListener('changeMine',function(url){
self.setState({
avatar:url
})
});
//通知开始,获取到url,调用setState 方法,刷新状态机,这时候实时的刷新了‘我的’图标
//最后别忘了移除通知
componentWillUnmount(){
this.listener.remove();
}

使用实例:
1. 点击底部按钮 触发分享朋友圈 / 下载海报图片(包括二维码)
//触发
_share(type = undefined) {
if (this.props.type === 'letter') {
DeviceEventEmitter.emit('_getSharePage', type); //全局注册分享事件
}
} <Button
onPress={() => {
this._share('wechat')
}}
title={分享到微信}
/> <Button
onPress={() => {
this._share('save')
}}
title={下载海报}
/>
调用
componentDidMount() {
// Toast.hide();
this.listener = DeviceEventEmitter.addListener('_getSharePage', (params) => {
captureRef(this.refs.viewShot, { //通过 ViewShot 绑定的ref来设置截图的类型大小格式
format: "jpg",
quality: 1.0,
result: 'tmpfile',
// snapshotContentContainer:true
}).then(
uri => { //uri就是返回的图片地址
switch (params) {
case 'qq':
break;
case 'wechat':
let message = {
platform: "wechat_session",
type: 'image',
imagePath: uri
};
JShareModule.share(message, (map) => {
if (map.state === 'success') {
// Toast.message('分享成功')
}
}, (map) => {
Toast.message('请安装微信后尝试')
// console.log("share failed, map: " + map);
})
break;
case 'pyq':
let wechat = {
platform: "wechat_timeLine",
type: 'image',
imagePath: uri
};
JShareModule.share(wechat, (map) => {
// Toast.message('分享成功')
}, (map) => {
Toast.message('取消分享')
})
break;
case 'weibo':
break;
default:
// if(!this.state.select){
// Toast.message('请选择封面图')
// return;
// }
if (Platform.OS === 'ios') {
check(PERMISSIONS.IOS.PHOTO_LIBRARY).then(response => {
// if (response === 'authorized') {
// } else {
// Toast.message('保存相片的权限没开启,请在iPhone的“设置-隐私”选项中,允许修改您的相册')
// }
switch (response) {
case RESULTS.UNAVAILABLE:
console.log(
'This feature is not available (on this device / in this context)',
);
break;
case RESULTS.DENIED:
console.log(
'The permission has not been requested / is denied but requestable',
);
break;
case RESULTS.GRANTED:
console.log('The permission is granted');
CameraRoll.saveToCameraRoll(uri,'photo').then(res => {
Toast.message('邀请好友截图保存成功');
}).catch(err => {
Toast.message(err);
})
break;
case RESULTS.BLOCKED:
console.log('The permission is denied and not requestable anymore');
break;
}
}).catch(err => {
console.log('看看错误是什么',err);
Toast.message('有错误找原因')
})
} else {
try {
PermissionsAndroid.request(
PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE
).then(granted => {
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
CameraRoll.saveToCameraRoll(uri, 'photo').then(res => {
Toast.message('邀请好友截图保存成功');
}).catch(err => {
Toast.message(err);
})
} else {
Toast.message('保存失败, 请授予权限');
}
}).catch(err => {
Toast.message('保存失败, 请授予权限');
})
} catch (err) {
Toast.message('保存失败, 请授予权限');
}
}
break;
}
},
error => {
Toast.message(error);
}
).catch(err => {
console.log(err);
});
})
}
DeviceEventEmitter React-Native 发送和接受消息(事件监听器)的更多相关文章
- kafka模拟客户端发送、接受消息
producer 消息的生成者,即发布消息 consumer 消息的消费者,即订阅消息 broker Kafka以集群的方式运行,可以由一个或多个服务组成,服务即broker zook ...
- linux上kafka模拟客户端发送、接受消息
producer 消息的生成者,即发布消息 consumer 消息的消费者,即订阅消息 broker Kafka以集群的方式运行,可以由一个或多个服务组成,服务即broker zook ...
- java 操作 RabbitMQ 发送、接受消息
例子1 Producer.java import java.io.IOException; import java.util.concurrent.TimeoutException; import c ...
- [技术博客]react native事件监听、与原生通信——实现对通知消息的响应
在react native中会涉及到很多页面之间的参数传递问题.静态的参数传递通常利用组件的Props属性,在初始化组件时即可从父组件中将参数传递到子组件中.对于非父子关系的组件来说,无法直接传递参数 ...
- ActiveMQ实现消息的发送与接受
activemq是apache的一个JMS接口的实现产品,java中定义了JMS规范,虽然RocketMQ,kafka现在比较火,但是还是建议先学一下activeMQ再学其他两个就容易很多 首先可以下 ...
- H5、React Native、Native应用对比分析
每日更新关注:http://weibo.com/hanjunqiang 新浪微博!iOS开发者交流QQ群: 446310206 "存在即合理".凡是存在的,都是合乎规律的.任何新 ...
- react native 布局注意点
一.react native中很多是ES6语法. 1行.表示是js的严格模式. 'use strict';严格模式中变量必须先声明,然后赋值.定义等:还有就是this的绑定. 2行到8行.导入依赖,可 ...
- C++服务器设计(五):多设备类型及消息事件管理
在传统的服务器系统中,服务器仅针对接收到的客户端消息进行解析,并处理后回复响应.在该过程中服务器并不会主动判断客户端类型.但在现实中,往往存在多种类型的客户端设备,比如物联网下的智能家居系统,就存在智 ...
- React Native 网络层分析
文:志俊(沪江Web前端) 本文原创,转载请注明作者及出处 在使用React Native开发中,我们熟练的采用JavaScript的方式发送请求的方式发送一个请求到服务端,但是处理这个请求的过程其实 ...
随机推荐
- Jenkins - Update information obtained: 不可用 ago;
Jenkins 添加插件 jenkins plugin提示: Update information obtained: 不可用 ago: 编辑 hudson.model.UpdateCenter.xm ...
- C语言函数的定义和使用(2)
一:无参函数 类型说明符 get(){ //函数体 } 二:无参函数 类型说明符 getname(int a,int b){ //函数体 } 三:类型说明符包括: int ,char,float,do ...
- Tyvj P2044 ["扫地"杯III day2]旅游景点
二次联通门 : Tyvj P2044 ["扫地"杯III day2]旅游景点 /* Tyvj P2044 ["扫地"杯III day2]旅游景点 并查集 先把大 ...
- 笔记-读官方Git教程(1)~认识Git
小书匠版本管理 教程内容基本来自git官方教程,认真都了系列的文章,然后对一些重点的记录下来,做了简单的归纳并写上自己的思考. 目录: 1.Git介绍 2.Git版本控制原理 3.Git特点 4.Gi ...
- Unity 3d 实现物体跟随摄像机视野运动
https://blog.csdn.net/qq_31411825/article/details/61623857 Unity 3d 实现物体跟随摄像机视野运动Created by miccall ...
- We found potential security vulnerabilities in your dependencies. Only the owner of this reposito...
删除package-lock.json并同步到git 定义的依赖项./package-lock.json具有已知的安全漏洞 找到一个叫做.gitignore,把package-lock.json贴在这 ...
- 安装 sqoop
简介 Sqoop是一个用来将Hadoop(Hive.HBase)和关系型数据库中的数据相互转移的工具,可以将一个关系型数据库(例如:MySQL ,Oracle ,Postgres等)中的数据导入到Ha ...
- spaceclaim脚本(内摆线)
import math #导入数学模块,因为会使用π def x_comp(k,r,t): #定义x坐标的计算函数 return r * (k -1) * math.cos(t) + r * math ...
- Tosca user space 这是自己的空间,可以create module ,test case 等一大堆模块,五脏俱全
- Flutter和原生交互学习
PlatformChannel功能简介 PlatformChannel分为BasicMessageChannel.MethodChannel以及EventChannel三种.其各自的主要用途如下: B ...