Flutter Bloc包，当本机代码从dart调用方法时产生状态

Flutter Bloc包是一个用于状态管理的库，它帮助开发者在Flutter应用程序中实现单向数据流的架构模式。当本机代码从Dart调用方法时，它可以产生不同的状态。

概念： Flutter Bloc（Business Logic Component）是一种用于管理应用程序状态的设计模式。它将应用程序的状态和业务逻辑分离，使得代码更易于维护和测试。Bloc模式通过将输入事件转换为输出状态来驱动应用程序的UI。

分类： Flutter Bloc包可以分为两种类型：Cubit和Bloc。

Cubit：Cubit是一个简化版的Bloc，它只处理状态的变化，不涉及复杂的业务逻辑。Cubit适用于简单的场景，例如表单验证、简单的数据展示等。
Bloc：Bloc是一个更强大的状态管理工具，它不仅处理状态的变化，还可以处理复杂的业务逻辑。Bloc通常用于需要处理异步操作、网络请求等复杂场景。

优势：使用Flutter Bloc包进行状态管理有以下优势：

单向数据流：Bloc模式通过单向数据流的方式管理状态，使得代码更易于理解和维护。
可测试性：由于业务逻辑和状态分离，可以更方便地编写单元测试和集成测试。
代码复用：通过将业务逻辑和状态管理分离，可以更好地实现代码的复用。

应用场景： Flutter Bloc包适用于以下场景：

复杂的业务逻辑：当应用程序需要处理复杂的业务逻辑时，使用Bloc可以更好地组织代码。
异步操作：当应用程序需要处理异步操作，例如网络请求、数据库操作等，使用Bloc可以更好地管理异步状态。
表单验证：当应用程序需要进行表单验证时，使用Cubit可以简化验证逻辑。

推荐的腾讯云相关产品：腾讯云提供了一系列与云计算相关的产品，以下是一些推荐的产品：

云服务器（CVM）：提供弹性计算能力，可根据业务需求灵活调整计算资源。
云数据库MySQL版（CDB）：提供高可用、可扩展的关系型数据库服务，适用于各种应用场景。
云存储（COS）：提供安全可靠的对象存储服务，适用于存储和管理大量非结构化数据。
人工智能机器学习平台（AI Lab）：提供丰富的人工智能算法和模型，帮助开发者快速构建和部署AI应用。
物联网套件（IoT Hub）：提供全面的物联网解决方案，帮助开发者连接、管理和控制物联网设备。

产品介绍链接地址：

云服务器（CVM）：https://cloud.tencent.com/product/cvm
云数据库MySQL版（CDB）：https://cloud.tencent.com/product/cdb
云存储（COS）：https://cloud.tencent.com/product/cos
人工智能机器学习平台（AI Lab）：https://cloud.tencent.com/product/ailab
物联网套件（IoT Hub）：https://cloud.tencent.com/product/iothub

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

初学者的 Flutter bloc

flutter Bloc 是 Flutter 应用的其中一个状态管理。我们可以通过它很容易处理应用中所有可能的状态。...Category 挂件展示通过调用 getGenres 方法 API 返回的不同的类型。...widget 通过 genres 额外参数调用 getGames 方法，展示 API 返回的过滤游戏数据。...mapGetCategoriesEventToState：这个方法调用一个存储库从 API 获取数据。当存储库返回数据或者抛出错误，bloc 会发射对应状态。...this.status, ); } } AllGamesBloc 这里我们调用存储库，当有可用的数据的时候，bloc 发射一个游戏列表副本的成功值，相反的，如果存储库返回无效值，bloc 会发射一个错误的状态

1551 0

Flutter BLoC 教程：使用 BLoC 模式的状态管理

BLoC 代表 Business Logic Components；它的目的是从用户界面分离程序的业务逻辑。使得应用程序代码更加优雅，可扩展和可测试。...使用 BLoC 的优点 ✅ 针对不同场景都有很出色的文档 ✅ 从 UI 中分离业务逻辑，因此使得代码更容易理解 ✅ 使得产品更易测试 ✅ 容易跟踪应用程序经历的状态使用 BLoC 的缺点 ✅ 其学习曲线有点陡峭...✅ 简单应用不推荐使用 ✅ 有更多标准化代码，但可以通过扩展解决 Flutter BLoC 教程目标我们将构建相关简单的应用，来演示 BLoC 如何使用流来管理状态，并为 bloc 编写一些测试。...提供我们的 BLoC import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; import...测试 BLoC 设计模式为了测试 bloc，我们需要安装以下两个包： ✅ bloc_test ✅ flutter_test 在测试 test 文件夹中，创建名为 app_bloc_test.dart

8471 0

Flutter 移动端架构实践：Widget-Async-Bloc-Service

控件可以是无状态或有状态的，但它们都不应包含任何显式状态管理的逻辑。显式状态管理的示例是 Flutter 计数器，当增量按钮被按下时，程序通过 setState() 对计数器进行值的递增。...2.返回一个Future的结果，调用的代码可以等待结果并相应地执行某些操作。 3.抛出一个异常，调用的代码可以通过try/catch捕获它，并在需要时展示一个警告。...数据层/BLoC中的行为 1.BLoC应该是纯Dart的——没有UI代码，没有导入Flutter相关类和文件，也没有在BLoC中使用BuildContext。...当Flutter重建窗口控件树时，处理嵌套的StreamBuilders会导致调试过程变得很棘手。这些因素都会让代码有额外的开销。...当更新app本地的状态（例如，将状态从一个控件传递到另一个控件中）时，BLoC有更简单的替代方案，这个后文再提。

16.1K2 0

写给前端工程师的Flutter教程

Dart 语言可以 AOT 编译成 ARM Code，让布局以及业务代码运行的最快，而且 Dart 的 GC 针对 Flutter 频繁销毁创建 Widget 做了专门的优化。...Dart UI as Code 在这里单独提出来的意义在于，从 React 开始，到 Flutter，到最近的 Apple SwiftUI，Android Jetpack Compose 声明式组件写法越发流行...Flutter App 的一切从lib/main.dart文件的 main 函数开始： import 'package:flutter/material.dart'; void main() => runApp...逐层状态创建就显得很麻烦了，更不要说代码的易读和易维护性了。...，也就是 Dart 也有自己的包仓库。

1.8K5 0

【Flutter】348- 写给前端工程师的 Flutter 教程

Dart 语言可以 AOT 编译成 ARM Code，让布局以及业务代码运行的最快，而且 Dart 的 GC 针对 Flutter 频繁销毁创建 Widget 做了专门的优化。...而相比 React Native： RN 使用 JavaScript 来运行业务代码，然后 JS Bridge 的方式调用平台相关组件，性能比有损失，甚至平台不同 js 引擎都不一样。...UI=F(state) Flutter App 的一切从lib/main.dart文件的 main 函数开始： import 'package:flutter/material.dart'; void...BlOC BlOC是 Flutter team 提出建议的另一种更高级的数据组织方式，也是我最中意的方式。...，也就是 Dart 也有自己的包仓库。

1.1K1 0

Flutter响应式编程：Streams和BLoC

有几种方法可以访问它：通过全局单例这种方式可以实现，但不是真的推荐。此外，由于Dart中没有类析构函数，因此你永远无法正确释放资源。作为局部变量你可以实例化BLoC的局部实例。...如果你查看示例代码“streams_4.dart”，你将看到以下代码行（第12-15行） home: BlocProvider( bloc: IncrementBloc...建议如下：（如果有任何业务逻辑）每个页面的顶部有一个BLoC，为什么不是ApplicationBloc来处理应用程序状态？每个“足够复杂的组件”都有相应的BLoC。...从ListPage或ListOnePage调用此页面; 6....不同BLoCs / Streams的编排下图显示了如何使用主要3个BLoC：在BLoC的左侧，哪些组件调用Sink 在右侧，哪些组件监听流例如，当MovieDetailsWidget调用inAddFavorite

4.2K9 0

Flutter BLoC 异步通信、BlocBuilder的基本使用、BlocProvider的初探

题记 —— 执剑天涯，从你的点滴积累开始，所及之处，必精益求精。 *** Flutter是谷歌推出的最新的移动开发框架。...BloC是一种架构模式也是一种编程思想，在Flutter中使用BloC时，首先要引入bloc库 dependencies: flutter_bloc: ^6.0.6 然后将依赖库拉取到本地 flutter...： import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:flutter_bloc.../flutter_bloc.dart'; import 'dart:async'; import 'bloc_time.dart'; ///Bloc 初探 class TestBlocTimePage...定义的 Bloc 角色，代码如下： import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:intl/intl.dart'; /

3.3K1 1

Flutter ——状态管理 | StreamBuild

实现的方法有好多种。 1.这个item是StatefulWidget,点击“关注”，然后setstate(){} 2.使用其他的状态管理去实现。...'; import 'package:hongka_flutter/app/Modules/home/info_organization.dart'; //我会省略部分代码，并且注释使用步骤 //步骤一...问题1 为何选择使用streamBuild 1.方法一使用StatefulWidget，刷新时使用setstate(){},使用setstate(){}刷新，会将整个item 进行重新构建，整个item...2.方法二使用状态管理bloc,如果使用了bloc,streamBuild中的stream 就因该传bloc的数据，如果我其它地方使用也使用了这个item,那么这个stream就应该传...6. bloc结合streamBuild 实现状态管理会在下一篇内容中讲解。

3K3 1

主题色切换+国际化三连

initIndex,initThemeData)), //在这提供provider ], child: child, //孩子 ); } } ---- 1.3- 使用状态和调用方法...state.themeData.primaryColor, fontSize: 18, fontWeight: FontWeight.bold), ... ---- 所以只要有需要颜色的地方，都可以使用这种方法从状态中拿主题色...Do not edit. import 'dart:async'; import 'package:flutter/foundation.dart'; import 'package:flutter/...总状态作为天子，再将任务细化分给各大诸侯，诸侯同样也细化分给卿大夫。当每个人都管理好自己的责任，那么就天下太平，生生不息。这里只用两个状态来说，也就是主题色和国际化。...在定义redux状态时，我习惯定义一个初始状态，方便使用。当然你也可以不用，直接在使用时来构建。

3.4K2 0

Flutter完整开发实战详解(十二、全面深入理解状态管理设计)

如下方代码所示，利用 scoped_model 实现状态管理只需要三步：定义 Model 的实现，如 CountModel ，并且在状态改变时执行 notifyListeners() 方法。...当 Model 设置给 AnimatedBuildler 时， Listenable 的 addListener 会被调用，然后添加一个 _handleChange 监听到 _listeners 这个...当 Model 调用 notifyListeners 时，会通过异步方法 scheduleMicrotask 去从头到尾执行一遍 _listeners 中的 _handleChange。...当然，更多的功能和更好的拓展性，也造成了代码的复杂度和上手难度，因为 flutter_redux 的代码使用篇幅问题，这里就不展示所有代码了，需要看使用代码的可直接从 demo 获取，现在我们直接看...4、当我们调用 Stroe 的 dispatch 方法时，我们会先进过 NextDispatcher 数组中的一系列 middleware 拦截器，最终调用到队末的 _changeController

2.1K2 0

Flutter 面试知识点集锦

Zone Dart 中可通过 Zone 表示指定代码执行的环境，类似一个沙盒概念，在 Flutter 中 C++ 运行 Dart 也是在 _runMainZoned 内执行 runZoned 方法启动...didChangeDependencies() 在 initState() 之后调用，当 State 对象的依赖关系发生变化时，该方法被调用，初始化时也会调用。...deactivate() 当 State 被暂时从视图树中移除时，会调用这个方法，同时页面切换时，也会调用。...dispose() Widget 销毁了，在调用这个方法之前，总会先调用 deactivate()。 didUpdateWidge 当 widget 状态发生变化时，会调用。 ?...常用状态管理的：目前有 scope_model 、flutter_redux 、fish_redux 、bloc + Stream 等几种模式，具体可见 : 《Flutter完整开发实战详解(十二、全面深入理解状态管理设计

5.1K6 1

Flutter 2.8 release 发布，快来看看新特性吧

从代码的角度来看它看起来是一样的： import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; import...(image-d24025-1639116490034)] 特定于平台的软件包如果你是软件包作者，必须选择哪些平台是将支持的，如果正在使用特定于平台的本机代码构建插件，可以使用pluginClass项目中的属性来实现...path_provider_windows 包一样在 100% Dart 中实现用于特定平台的功能，所以当没有任何本机类可以使用，但你仍想将你的包指定为仅支持某些平台时，请改用该dartPluginClass...HelloPluginWindows 使用这个配置后，即使没有任何 native 代码，也已将包指定为仅支持某些平台，另外还必须提供 Dart 插件类；可以在 flutter.dev 上的 Dart-only...当 dev 在未来几个月停用该频道时，请考虑 beta 或 master频道，具体取决于对问题的容忍度以及对最新和最好的需求。

4.2K2 0

Flutter Provider 使用指南详解

Provider允许您将数据模型暴露给整个应用程序，并在需要时轻松地访问和更新状态。它基于InheritedWidget构建，提供了一种简单而强大的方法来在Flutter应用程序中共享状态。...高级用法和最佳实践在使用 Provider 进行状态管理时，有一些高级用法和最佳实践可以帮助您更好地组织和管理代码。...遵循 Flutter 的最佳实践：无论是在使用 Provider 还是其他状态管理解决方案时，始终遵循 Flutter 的最佳实践和约定，以确保代码的质量和性能。...Bloc：单一数据流：Bloc 通过使用单一数据流的模式来管理应用程序的状态，使得状态更加可预测和可控。...强类型：Bloc 使用强类型的事件和状态来描述应用程序的状态变化，有助于减少错误和提高代码质量。

1.3K1 0

【Flutter 实战】pubspec.yaml 配置文件详解

name 此属性表示包名（package name），此属性是非常重要的，引入其他文件时需要使用此包名： import 'package:flutter_app/home_page.dart'; 如果你修改包名为...issue_tracker：issue，一般写当前插件源代码的Github issue 地址。 repository：一般写当前插件源代码的Github地址。...dependencies 和 dev_dependencies 就像其名字一样，dependencies 下的所有依赖会编译到项目中，而 dev_dependencies 仅仅是运行期间的包，比如自动生成代码的库...: AppMarketPlugin ios: pluginClass: AppMarketPlugin 此配置正常情况下不需要修改，当需要添加新平台适配时，直接添加： flutter...规定Dart和Flutter SDK的版本约束，管理依赖关系并设置Flutter特定的配置。

2.7K5 0

Flutter以两种方式实现App主题切换的代码

状态框架的实现可以帮助我们非常轻松的控制项目中的状态逻辑，使得代码逻辑清晰易维护。...Flutter 借鉴了 React 的状态控制，同样产生了一些状态管理框架，例如 flutter_redux、scoped_model、bloc。...以上代码我们实现了主题的切换，细心的朋友可以发现，我们还需要对主题进行保存，当下次启动 App 时，要显示上次切换的主题。...区别从 print log 中，可以发现，当使用 eventbus 事件总线进行切换主题刷新时，_AppState 下的 build方法和 home指向的组件界面整体都会重新构建。...源码已上传到 Github，详细代码可以查看 EventBus 实现整体代码： import 'package:flutter/material.dart'; import 'package:event_bus

3.3K3 0

flutter架构：Repository设计模式

:flutter_bloc/flutter_bloc.dart'; RepositoryProvider( create: (_) => HttpWeatherRepository...优点「：」完全可以使用不同的实现 ****，替换时只需要更改初始化时的一行代码。缺点**：**当我们在IDE点击“跳转到引用”时只能到抽象类中的方法定义而不是具体类中的实现。...缺点：会写更多代码。 4.2只有具体类优点：更少的代码。优点：IDE中点击“跳转到引用”能跳转到正确的方法。缺点：如果我们repository名字，需要多处修改。...5.repository的单元测试单元测试时，我们需要mock掉网络调用的部分，是我们的测试更快更准确。...我们在单测中，可以使用mocktail这样的包： import 'package:mocktail/mocktail.dart'; class MockWeatherRepository extends

2.6K3 0

flutter实战项目之博客项目

gitee https://gitee.com/itmxs/flutter_bloc_super 主分支默认空安全 image-20210928112956758 使用fvm版本控制全局激活 pub...SDK 版本，如果尚未安装，它将下载 SDK；现在，您可以通过运行来检查项目中是否正在运行 flutter flutter；此外，您还可以通过再次调用来检查 Flutter SDK 版本是否设置fvm...在项目根路径下执行：$ fvm use 2.5.1--force 完成上面的命令，会有个 .fvm 文件夹生成，然后配置 IDE，方法同上。可以愉快的玩耍 flutter 了。...检查所有依赖的迁移状态通过以下命令检查你的 package 的迁移状态 dart pub outdated --mode=null-safety image-20210926165313327 上面的输出说明了所有依赖的...改进迁移的结果当分析结果推导了错误的可空性时，你可以添加临时的提示标记来改变建议的编辑：在迁移工具的 Edit Details 窗格中，你可以通过 Add /\*?

8481 0

Flutter GetX使用---简洁的魅力！

所有周期回调，可以在相应回调内做一些操作响应式状态管理当数据源变化时，将自动执行刷新组件的方法 logic层这里变量数值后写.obs操作，是说明定义了该变量为响应式变量，当该变量数值变化时，页面的刷新方法将自动刷新...下级页面能随意调用上级页面事件，且关闭页面后，下次重进，数据也很自然重置了（全局Bloc不会重置，需要手动重置） [jump_getx] 实现页面一常规代码 logic 这里的自增事件，是供其它页面调用的...大家先别急着吐槽，当业务过于复杂，state层，也是会维护很多东西的，让我们看看下面的一个小栗子，下面实例代码是不能直接运行的，想看详细运行代码，请查看项目：flutter_use state class...，当某些模块涉及到大量的：提交表单数据，跳转数据，展示数据等等，state层的代码会相当的多，相信我，真的是非常多，一旦业务发生变更，还要经常维护修改，就蛋筒了在复杂的业务下，将状态层（state）和业务逻辑层...BLoC或Controller类中调用你的路由)，当你的应用程序被编译到web时，你的路由将出现在URL中。

7.6K10 3

【Flutter 状态管理】第一论：对状态管理的看法与理解

因为 _counter 需要通过构造方法进行传递，如果状态量过多，或共享场合变多、传递层级过深，也会使代码处理比较复杂。...2.通过 flutter_bloc 实现状态管理: 源码位置我们前面说过，状态管理的目的在于：让状态可以共享及在更新状态时可以同步更新相关组件显示，且将状态变化逻辑和界面构建进行分离。...当 event == CountEvent.add 时，会产出一个原状态 +1 的新 CountState 对象。...注: debounce : 当调用动作 n 毫秒后，才会执行该动作，若在这 n 毫秒内又调用此动作则将重新计算执行时间。...SearchStateEmpty : 输入字符为空时的状态，无维护数据。 [2]. SearchStateLoading : 从请求开始到响应中的等待状态，无维护数据。 [3].

1.5K2 0

一天搞定：Flutter + ChatGPT，打造智能聊天机器人

单元测试支持、组件测试支持，保证高质量代码。优秀的全局数据管理方式 flutter_bloc，完美的业务逻辑和界面UI代码分层隔离。...其代码逻辑可以参考这里：/main/lib/components/chat.dart实现难度非常低，因此右边这个聊天对话界面框架我直接让chatGPT帮我生成的，只是后期我补充了一些逻辑进来。...API，这和我们平常调用API 接口的方式有点不一样，平常是一次调用一次返回，而流式调用是一次调用多次返回，因此我们可以使用dart 的 stream API 来处理5、但是更好的方式是，使用flutter_bloc...多语言和主题设置的支持Flutter提供了国际化和主题管理API，我们可以将应用所需的各种语言和主题资源文件集中存放，并在应用启动时根据用户选择的语言和主题载入相关资源文件，这部分我使用flutter_bloc...在Flutter应用中，我们可以使用HTTP请求向ChatGPT发送请求，所有的逻辑全部都在flutter_bloc 封装的逻辑中完成，当然这里用到了 flutter pub 上别人提供的 dart

5.7K7 1

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云