react监听与 react native 监听

论坛 期权论坛 编程之家     
选择匿名的用户   2021-6-2 16:45   1497   0

react 监听:

npm install events --save

新建一个 events.js,引入 events 包,并向外提供一个事件对象,供通信时使用:

import { EventEmitter } from "events";
export default new EventEmitter();

// -----------------A页面-----------------------


import emitter from "./events"

 // 触发自定义事件
emitter.emit("callMe","Hello")


// --------------B页面---------------------------

import emitter from "./events"

// B页面 监听到来自A页面后的行为
componentDidMount(){
   // 声明一个自定义事件
   this.eventEmitter = emitter.addListener("callMe",(msg)=>{
    this.setState({
         msg
     })
   });
}

// 组件销毁前移除事件监听
componentWillUnmount(){
   emitter.removeListener(this.eventEmitter);
}

react native 监听:

// ----------------------A页面---------------

import { DeviceEventEmitter } from "react-native";


// 发送监听事
 DeviceEventEmitter.emit("tagChange", () => {
    const flag = true;
    return flag;
 });





// ---------------------B页面---------------------

import { DeviceEventEmitter } from "react-native";

 componentDidMount() {
   
    // 监听到子页面传过来的状态更改后
    this.listener = DeviceEventEmitter.addListener("change", flag => {
      if (flag) {
         // 
      }
    });
  }

  // 在组件销毁的时候要将其移除
  componentWillUnmount() {
    if (this.listener) {
      this.listener.remove();
    }
  }

分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:3875789
帖子:775174
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP