iis服务器助手广告广告
返回顶部
首页 > 资讯 > 移动开发 >Flutter EventBus事件总线的应用详解
  • 378
分享到

Flutter EventBus事件总线的应用详解

2024-04-02 19:04:59 378人浏览 薄情痞子
摘要

目录前言EventBus的简介EventBus的实际应用总结前言 Flutter项目中,有许多可以实现跨组件通讯的方案,其中包括InheritedWidget,Notificatio

前言

Flutter项目中,有许多可以实现跨组件通讯的方案,其中包括InheritedWidget,Notification,EventBus等。本文主要探讨的是EventBus事件总线实现跨组件通讯的方法。

EventBus的简介

EventBus的核心是基于Streams。它允许侦听器订阅事件并允许发布者触发事件,使得不同组件的数据不需要一层层传递,可以直接通过EventBus实现跨组件通讯。

EventBus最主要是通过触发事件监听事件两项操作来实现不同页面的跨层访问。触发事件是通过fire(event)方法进行,监听事件则是通过on<T>()方法进行的,其中泛型可以传入指定类型,事件总线将进行针对性监听,如果泛型传值为空,则默认监听所有类型的事件:

void fire(event) {
  streamController.add(event);
}
Stream<T> on<T>() {
  if (T == dynamic) {
    return streamController.stream as Stream<T>;
  } else {
    return streamController.stream.where((event) => event is T).cast<T>();
  }
}

EventBus的实际应用

1、在pubspec.yaml文件中引用eventBus事件总线依赖;

2、创建一个全局的EventBus实例;

3、使用fire(event)方法在事件总线上触发一个新事件(触发事件);

4、为事件总线注册一个监听器(监听事件);

5、取消EventBus事件订阅,防止内存泄漏。

// 1、在pubspec.yaml文件中引用eventBus事件总线依赖;
dependencies:
    event_bus: ^2.0.0
// 2、创建一个全局的EventBus实例;
EventBus myEventBus = EventBus();
// 3、使用fire(event)方法在事件总线上触发一个新事件(触发事件);
Center(
  child: ElevatedButton(
    onPressed: () {
      myEventBus.fire('通过EventBus触发事件');
    },
    child: Text('触发事件'),
  ),
)
var getData;
@override
void initState() {
  // TODO: implement initState
  super.initState();
  // 4、为事件总线注册一个监听器(监听事件);
  getData = myEventBus.on().listen((event) {
    print(event);
  });
}
@override
void dispose() {
  // TODO: implement dispose
  super.dispose();
  // 5、取消EventBus事件订阅,防止内存泄漏。
  getData.cancel();
}

总结

EventBus遵循的是发布/订阅模式,能够通过事件的触发和监听操作,有效实现跨组件通讯的功能。

以上就是Flutter EventBus事件总线的应用详解的详细内容,更多关于Flutter EventBus事件总线的资料请关注编程网其它相关文章!

--结束END--

本文标题: Flutter EventBus事件总线的应用详解

本文链接: https://www.lsjlt.com/news/166444.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • Flutter EventBus事件总线的应用详解
    目录前言EventBus的简介EventBus的实际应用总结前言 flutter项目中,有许多可以实现跨组件通讯的方案,其中包括InheritedWidget,Notificatio...
    99+
    2024-04-02
  • Flutter事件监听与EventBus事件的应用详解
    目录一 指针事件 Pointer二 手势识别三 跨组件事件的传递在Flutter中,手势有两个不同的层次: 第一层:原始指针事件(Pointer Events) 第二层:手势识别(G...
    99+
    2023-05-15
    Flutter事件监听 Flutter EventBus
  • Vue中事件总线(eventBus)的深入详解及使用
    目录1. 简介2. 使用安装及引入在组件中使用补充:移除监听事件总结1. 简介 Vue 组件中常见的有:父子组件通信、兄弟组件通信。而父子组件通信就很简单,父组件会通过 props ...
    99+
    2024-04-02
  • vue篇之事件总线EventBus使用示例详解
    目录正文父子组件通讯原则EventBus的简介如何使用EventBus初始化发送事件接收事件移除事件监听者全局EventBus创建全局EventBus总结正文 许多现代JavaScr...
    99+
    2024-04-02
  • Flutter事件监听与EventBus事件应用的方法是什么
    这篇文章主要介绍“Flutter事件监听与EventBus事件应用的方法是什么”,在日常操作中,相信很多人在Flutter事件监听与EventBus事件应用的方法是什么问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家...
    99+
    2023-07-06
  • Vue eventBus事件总线封装后再用的方式
    目录前言空vue实例构建的事件总线简单的方式复杂又简单的方式总结前言 现在的项目中是不是在使用 eventbus 的时候,还有很多人都是直接创建一个vue 实例直接使用的,哪里需要哪...
    99+
    2024-04-02
  • 详解c# 事件总线
    目录简介实现事件总线定义事件基类定义事件参数基类定义EventBus使用事件总线事件及事件参数定义发布者定义订阅者实际使用总结简介 事件总线是对发布-订阅模式的一种实现,是一种集中...
    99+
    2024-04-02
  • Vue eventBus事件总线封装后再用怎么实现
    今天小编给大家分享一下Vue eventBus事件总线封装后再用怎么实现的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下...
    99+
    2023-07-02
  • vue中的总线机制(EventBus)解析
    目录一、EventBus的简介二、使用方法第一步:2种方式初始化第二步:发送事件第三步:接受事件第四步:移除事件三、全局EventBus1、注册,在main.js中2、在组件中使用&...
    99+
    2022-11-13
    vue总线机制 vue中EventBus vue总线机制EventBus
  • android事件总线EventBus3.0使用方法详解
    一.EventBus概述 1.EventBus的三要素EventBus有三个主要的元素需要我们先了解一下:Event:事件,可以是任意类型的对象。Subscriber:事件订阅者,在EventBus3.0之前消息处理的方法只能限定于onEv...
    99+
    2023-05-30
    android 事件总线 eventbus3.0
  • JavaScript实现事件总线(Event Bus)的方法详解
    目录介绍原理分析进阶1. 如何在发送消息时传递参数2. 订阅后如何取消订阅3. 如何只订阅一次4. 如何清除某个事件或者所有事件5. TypeScript 版本6. 单例模式总结介绍...
    99+
    2024-04-02
  • Vue组件之事件总线和消息发布订阅详解
    目录简介事件总线消息的发布订阅总结简介 主要介绍事件总线的定义和编写方法和Vue是如何实现消息的订阅与发布的。 事件总线 事件总线是组件间通信的一种方式,适用于任意组件间的通信,比如...
    99+
    2024-04-02
  • 详解Guava中EventBus的使用
    目录Guava EventBus使用场景示例核心总结Guava EventBus EventBus是Guava的事件处理机制,是设计模式中观察者模式(生产/消费者编程模型)的优雅实现...
    99+
    2022-12-23
    Guava EventBus使用 Guava EventBus
  • Android触摸事件的应用详解
    前言上一篇讲了Android触摸事件的传递机制,具体可以看这里初识Android触摸事件传递机制。既然知道Android中触摸事件的传递分发,那么它能解决什么样的问题,在我们实际开发中如何应用,这点很重要,知道原理是为了解决问题而准备的。这...
    99+
    2023-05-31
    android 触摸事件 触摸
  • Vue3中事件总线的具体使用
    目录导读事件总线的本质构建一个EventEmitterconfig.globalProperties方法provide/inject结束语导读 在Vue2中,我们遇到复杂的组件通信时...
    99+
    2023-05-15
    Vue3 事件总线 Vue 事件总线
  • Vue3中的事件总线怎么使用
    本篇内容介绍了“Vue3中的事件总线怎么使用”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!事件总线的本质Vue2中的$on、$once、$e...
    99+
    2023-07-06
  • Vue全局事件总线$bus安装与应用小结
    目录1.什么是全局事件总线2.安装3.使用4.销毁完整版示例:1.什么是全局事件总线 一种组件间通信的方式,适用于任意组件间通信。 2.安装 在main.js里安装全局事件总线: n...
    99+
    2024-04-02
  • Vue全局事件总线你了解吗
    全局事件总线,是组件间的一种通信方式,适用于任何组件间通信。 看下面具体的例子。 父组件:App <template> <div class="app"&g...
    99+
    2024-04-02
  • Flutter的oktoast插件详解
    文章目录 简介详细介绍安装和导入导入在MaterialApp外面套一层OKToast组件为什么是包住MaterialApp? 显示Toast消息: 高级使用Toast位置Toast持...
    99+
    2023-09-18
    flutter oktoast 提示 toast 调试
  • Vue中使用和移除总线Bus的注意事项详解
    目录初始化并封装发送事件接收事件移除事件监听实际使用正确测试效果错误测试效果初始化并封装 在main.js中对bus进行初始化, Bus是一个不具备 DOM 的组件,它具有的仅仅只是...
    99+
    2023-05-18
    Vue使用总线Bus Vue移除总线Bus
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作