flutter Bloc add两次只响应一次问题解析

目录
  • 问题描述
  • 原因分析
  • 处理方式

问题描述

连续调用两次addEvent，结果最终只能响应一次，第二次事件无法响应。

@override
  Stream<SomeState> mapEventToState(SomeEvent event) async*{
    if(event is InCreaseEvent){
      state.num ++;
      yield state;
    }
  }

someBloc.add(InCreaseEvent());
someBloc.add(InCreaseEvent());

原因分析

bloc 继承于 cubit ， 查看 cubit 源码得知，状态更新时做了判断，如果接收到的 newState 与 currentState 为同一个对象，则直接 return，不响应本次状态变更。

处理方式

1. State实现copyWith()方法每个State类都要有copy()方法，用于产生state对象的副本；每次编辑 state 的字段内容，然后 yield 副本，保证每次 yield 的都是新的对象。

class SomeBloc extends Bloc<SomeEvent, SomeState>{
  SomeState _currentState;
  SomeBloc(SomeState initialState) : super(initialState){
    _currentState = initialState;
  }
  @override
  Stream<SomeState> mapEventToState(SomeEvent event) async*{
    if(event is InCreaseEvent){
      _currentState.num ++;
      //每次 yield 新对象
      yield _currentState.copyWith();
    }
  }
}
class SomeState{
  int num;
  SomeState(this.num);
  ///新加 copyWith 方法用于生成副本
  SomeState copyWith(){
    return SomeState(num);
  }
}
abstract class SomeEvent{}
class InCreaseEvent extends SomeEvent{}

2.使用Equatable state继承Equatable重写get方法

以上就是flutter Bloc add两次只响应一次问题解析的详细内容，更多关于flutter Bloc add两次响应一次的资料请关注我们其它相关文章！

赞 (0)

相关推荐

  • flutter Bloc 更新后事件同步与异步详解

    目录 前言 使用方式 Bloc 新形态用法 事件队列的阻塞属性? 前言 最近,小轰参与了公司 flutter 项目关于 Dart 2.0 的空安全升级工作.我们升级了所有依赖的三方库,其中就包括有 Bloc 库.作为一款使用率颇高的状态管理框架, Bloc 在版本迭代中进行了少许结构和细节的优化,下面是小轰对于 Bloc 新版本的使用总结. 使用方式 小轰使用的 Bloc 版本如下 flutter_bloc: ^7.3.1 通过最简单的例子来学习新知识 创建一个包含 加 减 操作的页面,使用 b

  • Flutter状态管理Bloc之定时器示例

    Flutter状态管理Bloc之定时器示例

    本文实例为大家分享了Flutter状态管理Bloc之定时器的具体代码,供大家参考,具体内容如下 1. 依赖 dependencies:   flutter_bloc: ^2.1.1   equatable: ^1.0.1   wave: ^0.0.8 2. Ticker Ticker 用于产生定时器的数据流. /// 定时器数据源 class Ticker {      /// 定时器数据源   /// @param ticks 时间   Stream<int> tick({int ticks

  • Flutter状态管理Bloc使用示例详解

    Flutter状态管理Bloc使用示例详解

    目录 前言 两种使用模式 Cubit模式 最后 前言 目前Flutter三大主流状态管理框架分别是provider.flutter_bloc.getx,三大状态管理框架各有优劣,本篇文章将介绍其中的flutter_bloc框架的使用,他是bloc设计思想模式在flutter上的实现,bloc全程全称 business logic ,业务逻辑的意思,核心思想就是最大程度的将页面ui与数据逻辑的解耦,使我们的项目可读性.可维护性.健壮性增强. 两种使用模式 首先第一步引入插件: flutter_bl

  • Flutter状态管理Bloc之登录示例

    Flutter状态管理Bloc之登录示例

    本文实例为大家分享了Flutter状态管理Bloc之登录的具体代码,供大家参考,具体内容如下 1. 依赖 dependencies:   flutter_bloc: ^2.1.1   equatable: ^1.0.1 2. UserRepository 用于管理用户数据 提供认证方法,删除Token,保存Token,是否包含Token四个方法. import 'package:flutter/material.dart';   /// 用户数据仓库 class UserRepository {

  • flutter Bloc add两次只响应一次问题解析

    flutter Bloc add两次只响应一次问题解析

    目录 问题描述 原因分析 处理方式 问题描述 连续调用两次addEvent,结果最终只能响应一次,第二次事件无法响应. @override Stream<SomeState> mapEventToState(SomeEvent event) async*{ if(event is InCreaseEvent){ state.num ++; yield state; } } someBloc.add(InCreaseEvent()); someBloc.add(InCreaseEvent());

  • flutter Bloc 实现原理示例解析

    目录 序言 1. 事件流 > 状态流 (中转) 2. 使用 BlocBuilder 实时监听状态变更, 如何实现的呢? 总结 扩展 序言 在flutter开发中,我们使用 bloc 框架,基于状态变更进行响应式开发.本篇文章,小轰将 bloc 核心业务块进行拆解简化,聊一聊它的实现思想,bloc 核心能力分为如下两点: 添加事件 event,将 '事件流' 转换为 '状态流' state 监听 bloc 流,每次 state 状态变更,通知 widget 更新 下面,用自定义Bloc的方式,来给

  • javascript 响应键盘特定按键(只响应数字键)

    响应键盘特定按键(只响应数字键) =48&&event.keyCode=96&&event.keyCode [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • Flutter 点击两次退出app的实现示例

    目录 1.App组件 2.InAppWebview组件 在安卓手机上才会有物理返回键,而ios手机是没有的,所以说这个是安卓手机独有的功能. 使用场景:当用户在某一段时间内连续点击两次返回键,才会被认为是退出应用. 在Flutter中想实现这个功能,首先我们先来认识一个Flutter中的组件WillPopScope,在Flutter中我们是用这个组件来实现物理返回键拦截的,从而实现点击两返回键退出应用. onWillPop是他的一个回调函数,当用户点击返回按钮时被调用(Android物理返回按钮

  • Flutter加载图片流程之ImageProvider源码示例解析

    目录 加载网络图片 ImageProvider resolve obtainKey resolveStreamForKey loadBuffer load(被废弃) evict 总结 困惑解答 加载网络图片 Image.network()是Flutter提供的一种从网络上加载图片的方法,它可以从指定的URL加载图片,并在加载完成后将其显示在应用程序中.本节内容,我们从源码出发,探讨下图片的加载流程. ImageProvider ImageProvider是Flutter中一个抽象类,它定义了一种

  • SpringMVC请求/响应乱码问题解决方案解析

    这篇文章主要介绍了SpringMVC请求/响应乱码问题解决方案解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 GET请求乱码原因分析 GET请求参数是通过请求行中的URL发送给Web服务器(Tomcat)的. Tomcat服务器会对URL进行编码操作(此时使用的是Tomcat设置的字符集,默认是iso8859-1) 到了我们的应用程序中的请求参数,已经是被Tomcat使用ISO8859-1字符集进行编码之后的了. 解决方式 方式一 修改to

  • react-native只保留3x图原理解析

    目录 引言 1. 输出构建产物 2. RN如何决定加载哪张scale图片? 3. repo中是否可以只保留3x图? 3.1 资源上传 3.2 资源下载 4. 结论 引言 我们的react-native项目中,一张图片一般会存在1x, 1.5x, 2x, 3x几种尺寸(1.5x是android特有的),以便在不同屏幕尺寸的手机加载对应尺寸的图片. 1. 输出构建产物 如果我们在代码中引入了一张图片,例如 // index.js import bg from './bg.png'; . ├── in

  • Vue响应式原理深入解析及注意事项

    Vue响应式原理深入解析及注意事项

    前言 Vue最明显的特性之一便是它的响应式系统,其数据模型即是普通的 JavaScript 对象.而当你读取或写入它们时,视图便会进行响应操作.文章简要阐述下其实现原理,如有错误,还请不吝指正.下面话不多说了,来随着小编来一起学习学习吧. 响应式data <div id = "exp">{{ message }}</div> const vm = new Vue({ el: '#exp', data: { message: 'This is A' } }) vm

  • Vue watch响应数据实现方法解析

    在vue中,使用watch来响应数据的变化.watch的用法大致有三种.下面代码是watch的一种简单的用法: <input type="text" v-model="cityName"/> new Vue({ el: '#root', data: { cityName: 'shanghai' }, watch: { cityName(newName, oldName) { // ... } } }) 直接写一个监听处理函数,当每次监听到 cityNam

随机推荐