问题标签 [bloc]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
573 浏览

flutter - 导航到另一个屏幕时我丢失了流数据

我是 Dart/Flutter 的新手,在“参加”了 Udemy 课程之后,一切都很顺利。到现在 ;-)

与 Udemy 课程中的示例应用程序一样,我使用的是 BLOC 模式。

像这样:

(请参阅我稍后用来获取“Ap​​pBloc”的“AppBlocProvider”)

该应用程序以及所有屏幕都是 StatelessWidget 的。

AppBlocProvider 扩展了 InheritedWidget。像这样:

AppBlocProvider 提供了一个“AppBloc”,其中包含两个进一步的块以将不同的数据分开一点。像这样:

在我的应用程序中,我有一个只有一个输入字段的“GroupSearchScreen”,您可以在其中输入组名的片段。单击按钮时,将完成 REST API 调用并返回组名列表。

与示例应用程序一样,我也将数据放入流中。

在示例应用程序中,数据获取并将其放入流中是在块本身中完成的。在下一行,创建了使用数据的屏幕。像这样:

然而,就我而言,有两个主要区别:

  1. 在 GroupSearchScreen 中收集数据后,我调用/创建 GroupsListScreen,其中应显示组列表,使用常规路由。像这样:

    //向流中添加数据(“changeGroupList”提供了流的添加功能!) appBloc.groupsBlock.changeGroupList(groups); //调用/创建屏幕以显示组列表 Navigator.pushNamed(context, '/groups_list');

  2. 在创建的 GroupsListScreen 中,我获取了 bloc。像这样:

    小部件构建(上下文){ final AppBloc appBloc = AppBlocProvider.of(context);

这些是路线:

而“/groups_list”指向这个函数:

如您所见,“AppBlocProvider”仅使用一次。(我也遇到了这个问题;-)

现在解决问题:

当 GroupsListScreen 开始渲染列表时,流/快照没有数据!

(参见“如果(!snapshot.hasData)”)

为了测试 bloc 中的所有数据是否丢失,我尝试不将数据直接放入流中,而是放入成员变量中(在 bloc 中!)。

在 GroupSearchScreen 中,我将 json 数据放在 bloc 的成员变量中。

现在,就在 GroupsListScreen 开始渲染列表之前,我将数据 (json) 从 bloc 中取出,放入流中,它仍然驻留在 bloc 中,一切正常!快照有数据...

像这样(在 GroupsListScreen 中):

当普通成员变量不是时,为什么流在从“GroupSearchScreen”到“GroupsListScreen”的过程中“丢失”其数据?两者都在同一个集团!

在 GroupsListScreen 的构建方法开始时,我有一个打印语句。因此,我可以看到 GroupsListScreen 构建了两次。这应该是正常的,但这可能是在流中找不到数据的原因吗?流听了两次吗?

我试图以这种方式解释我的问题,而不是提供大量代码。但我不知道是否足以提示我可以在哪里继续搜索......

更新 16.04.2019 - 解决方案:

我使用 Udemy 课程中看到的另一个应用程序构建了我的第一个应用程序......

“他的”应用程序和我的应用程序之间最重要的区别是他创建了监听流然后将数据添加到流中的 Widget。

我将数据添加到流中,然后导航到显示数据的小部件。

不幸的是,我使用了 RX-Dart “PublishSubject”。如果您收听那个,您将获得从您开始收听的那一刻开始放入流中的所有数据!

然而,RX-Dart "BehaviorSubject" 也会在您开始收听之前为您提供最后的数据。

这就是我在这里需要的行为:

  1. 将数据放在流上

  2. 创建小部件并开始收听

我可以鼓励所有 Flutter 新手阅读这两个非常好的教程:

https://medium.com/flutter-community/reactive-programming-streams-bloc-6f0d2bd2d248

https://www.didierboelens.com/2018/12/reactive-programming---streams---bloc---practical-use-cases/

在第一个中,提到的两个流都得到了很好的解释。

0 投票
2 回答
2131 浏览

dart - 在一个 StreamBuilder 中使用 2 个不同的流

在一个 Stream Builder 中使用 2 个不同的流是可能的,或者我应该如何解决这个问题?

我尝试为它们两个使用一个流,但主题数据的 BehaviorSubject 是 ThemeData 模型,而 languageStream 是一个字符串,但它无法正常工作。

这些是我要使用的流

集团看起来像这样:

另一个像这样

我需要两个流都在主页中,因为它会影响整个应用程序。

0 投票
2 回答
4267 浏览

dart - 如何在 Hot Reload 上使用 Provider 维护 Flutter Global BloC 状态?

每当我执行热重载时,我似乎都会丢失应用程序状态。

我正在使用 BloC 提供程序来存储应用程序状态。这在 main.dart 中的 App 级别传递并在子页面上使用。在视图的初始加载时,会显示该值。我可以在应用程序中导航并且状态仍然存在。但是,当我执行热重载时,我会丢失值和看似状态。

如何解决此问题,以便在热重载时保留状态?

集团供应商

0 投票
0 回答
132 浏览

flutter - Flutter bloc 和 Angular 可观察数据服务

我是 Flutter 的新手,我正在学习使用 bloc 模式。

您是否发现 bloc 模式与 angular 与可观察数据服务共享相同的方法?

https://blog.angular-university.io/how-to-build-angular2-apps-using-rxjs-observable-data-services-pitfalls-to-avoid/

https://coryrylan.com/blog/angular-observable-data-services

0 投票
1 回答
874 浏览

flutter - 是否有类似于 CombineLatest 仅适用于 1 个流的功能?

我是 Rxdart 的新手,我已经为 2 种流尝试了 Combinelatest2,例如:

在我的 validateEmail 和 validatePassword 中:

这是我主页屏幕上的按钮:

如果使用 combinelatest2 我可以从 observable 获得 2 种发射的变化,我可以打开/关闭按钮,但如果我只想观察电子邮件,我该怎么做?如果来自电子邮件的发射器是正确的,则提交按钮打开,反之亦然

0 投票
2 回答
8725 浏览

dart - 使用 bloc 框架时如何为文本字段提供默认值

我编写了一些简单的颤振应用程序,它们使用有状态的小部件/表单/文本表单字段来输入和管理数据。现在我正在尝试了解如何使用 BLoC 和流构建器来完成类似的工作。但我不知道如何为我的字段设置初始值。

我试图创建一个最简单的例子,我可以想出一个使用 bloc 的小应用程序。这只需要一个输入到 TextField 中的名称并将其回显到下一行。

我不知道如何为我的姓名字段指定初始值。

我必须承认,来自旧式编程背景,我需要一段时间才能让我的思想进入反应式编程 - 但向前和向上!

编辑 - 感谢给出的评论 - 更新了代码以使用 TextEditingController 和 StreamBuilder initialData 的组合,并且似乎工作正常。如果有更好的解决方案,很高兴提出进一步的意见:)

0 投票
1 回答
1663 浏览

flutter - inheritFromWidgetOfExactType 不适用于通用 InheritedWidget

似乎inheritFromWidgetOfExactType方法无法找到InheritedWidget小部件是否是泛型的子级StatefulWidget并且本身是泛型的。

我正在使用 InheritedWidget 来实现 bloc 模式。BlocProvider 的初始实现如下所示:

如果直接使用就可以了:

但是我想用 StatefulWidget 包装 bloc 提供程序,这样每次重建小部件树时都不会重建 bloc 状态。

现在,当我尝试使用此模式inheritFromWidgetOfExactType返回null而不是 InheritedWidget 时:

有什么办法可以克服这个问题?请注意,我希望能够使用这种方法嵌套 bloc 提供程序。

0 投票
0 回答
161 浏览

dart - 即使没有调用写/读操作,如何连续修复firestore读/写数据

我正在为我的应用程序使用https://github.com/boeledi/blocs中描述的 bloc 模式。在应用程序中,我基本上是在 Firestore 中获取和写入数据。最近我注意到,当我用很少的写入请求测试应用程序时,我在 firestore 中的 20k 免费写入很快就结束了。经过监控,我发现我的应用程序不断地从 Firestore 写入/读取数据(虽然我看不到任何新数据正在写入。)。我在没有发出任何读/写请求的情况下监视了我的 firestore 应用程序的控制台大约一个小时,并且惊讶地发现请求的发出非常频繁,这在大约几个小时内耗尽了我的 20k 写入配额。

到目前为止,我一直试图弄清楚为什么不断地提出请求,但我无法弄清楚为什么会发生这种情况。在互联网上搜索后,我没有找到任何具体的答案,所以我很确定这是因为我碰巧犯了菜鸟错误,特别是因为这是我第一次使用 firestore 和 flutter。

读取操作:

写操作:

为了调用写操作,我正在监听一个流,该流基本上将检查与 itemField 相关的文本字段中提供的数据是否有效。一旦被认为有效,RaisedButton 将变为活动状态并发出事件以更新信息。

收到事件后,事件处理程序将执行以下操作:

我想减少不必要的写入和读取操作的数量,如果应用程序继续如此频繁地发出读/写请求,这将花费我一大笔钱。谢谢您的帮助。

0 投票
1 回答
2051 浏览

dart - 为什么这个 bloc getter 在 null 上调用?

以前我在我的 main.dart 中初始化我的 PersonBlocProvider

并在另一个视图中使用 BLOC,如下所示:

这行得通,但是一旦应用程序启动就会产生 BLoC,我意识到我不想要那样。

所以我决定将 BlocProviders 从 main 移动到我的视图文件中。

我的主要变成了

并查看:

但现在这导致错误:

为什么现在为空?

0 投票
1 回答
1637 浏览

flutter - 在 Dart (Flutter) 中将两个“yield”并排放置,只有第二个被执行

在 Flutter 中,我正在使用 BLoC 模式和 Firebase 制作登录/注册页面。注册用户后,我正在发送验证电子邮件并将状态更改为“VerificationEmailSentState”(这样我就可以显示 SnackBar 并在 PageView 中切换到登录页面),然后将其重新更改为初始状态(InitialState)。问题是它直接跳转到 InitialState 而没有通过 VerificationEmailSentState 因此没有显示 SnackBar 或切换到登录页面!

当我调试代码时,我发现它实际上将状态更改为 (VerificationEmailSentState),但随后立即将其更改回 InitialState,因此 BlocBuilder 中的代码没有被执行,因为当我更改时它被中断(重新构建)状态到 InitialState。为了确保,我在第一次更改状态后延迟了 1 秒并且它起作用了(出现了 SnackBar)。

问题是为什么会发生这种情况?延迟状态的第二次变化是个好主意吗?如果没有,没有它如何让它工作?