开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

flutter StreamBuilder中使用的Firestore快照永远不会在数据更改时更新

Flutter是一种跨平台的移动应用开发框架，而StreamBuilder是Flutter中用于构建基于流的UI的小部件之一。Firestore是Google提供的一种云端NoSQL数据库服务，用于存储和同步应用程序的数据。

在Flutter中使用StreamBuilder和Firestore快照时，可能会遇到快照不会在数据更改时自动更新的情况。这可能是由于以下原因导致的：

数据源未正确设置：在使用StreamBuilder时，需要确保正确设置了数据源。在Firestore中，可以使用stream()方法来监听数据的变化并返回一个数据流。确保正确地将Firestore的数据流与StreamBuilder关联起来。
数据流没有正确订阅：在使用StreamBuilder时，需要确保正确地订阅了数据流。可以使用StreamBuilder的stream参数来传递Firestore的数据流，并使用builder参数来构建UI。确保正确地订阅了数据流，以便在数据更改时能够接收到更新。
数据更改未触发更新：Firestore的数据流在数据更改时应该会触发更新。但是，如果数据更改没有正确地触发更新，可能是由于Firestore的规则设置不正确或者数据更改的方式不正确导致的。确保Firestore的规则设置允许读取和写入数据，并且在更新数据时使用正确的方法。

总结起来，要确保在Flutter中使用StreamBuilder和Firestore快照时能够在数据更改时更新，需要正确设置数据源、正确订阅数据流，并确保数据更改能够正确触发更新。如果仍然无法解决问题，可以查阅Flutter和Firestore的官方文档或寻求相关技术支持。

腾讯云相关产品和产品介绍链接地址：

腾讯云Flutter开发平台：https://cloud.tencent.com/product/flutter
腾讯云云数据库MongoDB：https://cloud.tencent.com/product/mongodb
腾讯云云开发：https://cloud.tencent.com/product/tcb
腾讯云云函数（Serverless）：https://cloud.tencent.com/product/scf
腾讯云云存储COS：https://cloud.tencent.com/product/cos

相关搜索:Flutter:使用Firestore中的数据生成小部件列表 Flutter:如何使用以前的状态更新Firestore中的数据 Flutter:将firestore快照转换为streambuilder中的列表为什么我不能使用firestore flutter中的这些函数来更新imageurl？使用flutter中的firebase firestore中的数据，根据下拉列表自动填充文本字段使用flutter从GridView内的firebase firestore中检索数据使用Flutter和Firestore中的新数据更新StreamBuilder 使用Flutter更新Firestore Cloud中的文档值，仅具有此类文档的唯一键值使用StreamBuilder使用Firestore中的数据填充颤动DataTable 使用Swift更新Cloud Firestore数据库中的数据

相关搜索:

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

有帮助

没帮助

相关·内容

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

事实上，一些状态管理的技术被普遍使用： Scoped Model以其简单而著称 BLoC也被广泛使用，借助于Streams和RxDart，它适用于更复杂的应用程序在最近的Google I/O大会上，Flutter...数据层/BLoC中的行为 1.BLoC应该是纯Dart的——没有UI代码，没有导入Flutter相关类和文件，也没有在BLoC中使用BuildContext。...输入的数据（读取）：将来自Firestore文档的键值对的流转换为强类型的不可变数据Model。数据输出（写入）：将数据Model转换为键值对，以便写入Firestore。...API向Cloud Firestore中写入和读取数据。...当更新app本地的状态（例如，将状态从一个控件传递到另一个控件中）时，BLoC有更简单的替代方案，这个后文再提。

16K2 0

StatefulWidget的使用案例

也就是说，如果我们想改变页面中的数据，那么就需要用到StatefulWidget。...首先我们在VSCode中安装一个名为“Awesome Flutter Snippets”的插件，该插件提供了Flutter中各种常用的类和方法的快速构建方式，可以极大地提升开发效率，如下所示：捷径...dis 部署永久地从树中删除此对象时调用。当此State对象永远不会再次构建时，框架将调用此方法。...streamBldr Stream Builder StreamBuilder根据与指定交互的最新快照创建新的构建自身stream animatedBldr 动画生成器创建动画生成器...debugP 调试打印将消息打印到控制台，您可以使用flutter工具的logs命令（flutter logs）访问该控制台。

3.3K2 0

在 Flutter 中探索 StreamBuilderimage

假设您需要根据一个 Stream 的快照在 Flutter 中构造一个小部件，那么有一个名为 StreamBuilder 的小部件。...在这个博客中，我们将探索 Flutter 中的 StreamBuilder。我们还将实现一个演示程序，并向您展示如何在您的 Flutter 应用程序中使用 StreamBuilder。...介绍: StreamBuilder 可以监听公开的流，并返回小部件和捕获获得的流信息的快照。造溪者提出了两个论点。...initialData: 将利用这些数据制作初始快照 required AsyncWidgetBuilder builder: 生成过程由此生成器使用如何实现 dart 文件中的代码: 你需要分别在你的代码中实现它...这是我对 StreamBuilder On User Interaction 的一个小小介绍，它正在使用 Flutter 工作。

2.5K0 0

Flutter完整开发实战详解(十一、全面深入理解Stream)

StreamBuilder>( stream: dataStream, initialData: ["none"], ///这里的 snapshot 是数据快照的意思...二、StreamBuilder 如下代码所示, 在 Flutter 中通过 StreamBuilder 构建 Widget ，只需提供一个 Stream 实例即可，其中 AsyncSnapshot 对象为数据快照...StreamBuilder>( stream: dataStream, initialData: ["none"], ///这里的 snapshot 是数据快照的意思...三、rxdart 其实无论从订阅或者变换都可以看出， Dart 中的 Stream 已经自带了类似 rx 的效果，但是为了让 rx 的用户们更方便的使用，ReactiveX 就封装了 rxdart 来满足用户的熟悉感...如下代码所示是 rxdart 的简单使用，可以看出它屏蔽了外界需要对 StreamSubscription 和 StreamSink 等的认知，更符合 rx 历史用户的理解。

3.5K4 1

Flutter 2.8正式版发布了，还不来看看

因此，你不会在应用的整个生命周期内产生每秒 60 倍的成本，而是只有一次创建的成本。...Firebase 相关的更新 Flutter 生态中另一个重要组成是 FlutterFire，大约有三分之二的 Flutter 应用都在使用它。...服务，方便线上使用和体验更方便构建认证和在实时查询 Firestore 数据的 UI 界面 Flutter 中使用 Firestore Object/Document 映射的支持进入 Alpha 版...另一个支持是在 FlutterFire 文档中直接内嵌了 DartPad 实例，比如 Firestore 的示例页面: 在这个示例中，你将看到 Cloud Firestore 的文档以及示例应用的代码...、结构化对象和方法来简化 Firestore 的使用。

22.3K3 0

【Flutter】FutureBuilder 异步编程 ( FutureBuilder 构造方法 | AsyncSnapshot 异步计算 )

结合在一起 ; 它可以将异步操作的结果 , 异步的更新到 UI 界面中 ; 异步操作结果 : 网络请求 , 数据库读取 , 等耗时操作得到的结果 ; 二、FutureBuilder 构造方法...data 是异步计算接收的最新数据 ; Object?...error 是异步计算接收的错误对象 ; AsyncSnapshot snapshot 中还有 hasData 和 hasError 两个属性 , hasData 用于检查该对象是否包含非空数据值.../animations/ 博客源码下载 : GitHub 地址 : https://github.com/han1202012/flutter_http( 随博客进度一直更新 , 有可能没有本博客的源码...) 博客源码快照 : https://download.csdn.net/download/han1202012/21528472 ( 本篇博客的源码快照 , 可以找到本博客的源码 )

8522 0

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

利用 StreamBuilder 加载监听 Stream 数据流，通过 snapShot 中的 data 更新控件。...当然，更多的功能和更好的拓展性，也造成了代码的复杂度和上手难度，因为 flutter_redux 的代码使用篇幅问题，这里就不展示所有代码了，需要看使用代码的可直接从 demo 获取，现在我们直接看...，最后更新到 StreamBuilder 。...的 StreamBuilder 更新数据。...现在看起来使用流程是不是变得复杂了？但是这带来的好处就是复用的颗粒度更细了，装配和功能更加的清晰。那这个过程是如何实现的呢？后面我们将分析这个复杂的流程。

1.9K2 0

FlutterDojo设计之道—状态管理之路（三）

通过Dart提供的Stream机制，Flutter可以很轻松的构建响应式的编程方式，同时也让跨页面、跨Widget的数据管理问题迎刃而解。 Flutter的响应式编程，具有下面几个特点。... snapshot就是流中的数据快照，可以通过snapshot.data来访问流中的数据，或者通过snapshot.hasError、snapshot.error来获取异常信息。...BLoC流的单播与广播 Flutter中的Stream分为两种，单播与多播，默认情况下创建的是单播Stream，这样的话，只能有一个StreamBuilder来监听，如果存在多个StreamBuilder...举个例子，比如在第一个界面在流中添加了一些数据，再打开第二个界面的时候，创建StreamBuilder之后，是无法直接获取流的最新数据的，因为这时候流中的的数据在StreamBuilder监听之前就已经结束了...所以这种情况下，要么是在创建StreamBuilder前，初始化initialData的值为流中最新的数据；要么是使用RxDart来强化流的功能。

1.6K3 0

Flutter 的状态管理方案：setState、BLoC、ValueNotifier、Provider

image.png 例如，我们使用简单的身份验证流程。当登录请求发起时，设置正在加载中的状态。...在 _signInAnonymously 方法中，通过调用 bloc.setIsLoading(value) 来更新 stream。...通过 StreamBuilder 来检查加载状态，并使用它来设置登录按钮。...作为 BloC 的替代方案，我们可以使用 BehaviorSubject 来跟踪加载状态，并根据需要进行更新。我会通过 GitHub 项目来展示具体如何实现。...这是 Flutter SDK 中 ValueNotifier 的实现： /// A [ChangeNotifier] that holds a single value. /// /// When [value

4.4K0 0

Flutter 实践 MVVM

但是ViewModel就需要考虑了，因为MVVM一个很重要的特性就是双向绑定，Model中数据的更新会及时的反馈到View上，View上的更新也会及时的反馈给Model。...iOS里，也可以通过ReactiveCocoa来实现数据的双向绑定。而在Flutter中，我们可以借助Stream&Sink来实现数据变更的通知，StreamBuilder来做View层的绑定。...注释(2)处，这里是获取到数据后，构建随之更新widget的方法。snapshot.data就是监听的数据，更新后的新数据。...主要就是引入了StreamWidget，StreamBuilder，然后更新了一下ViewModel和View的数据绑定方式，总体来说还是比较简单的。...，然后对更新的数据做相关的操作。

9.8K7 0

优雅的UI与Model绑定 Flutter DataBus使用~

Flutter开发中，大家都绕不开Widget的刷新，setState()是最简单的用法。...如何优雅的解决这个问题，不得不提到StreamBuilder,StreamBuilder是Flutter中异步构建的核心组件。许多著名的开源框架例如Bloc皆是基于此实现。...其实Flutter中还提供了一个强大组件SteamBuilder来协助我们处理控件的刷新构建。 ---- StreamBuilder ? ?...如图，是StreamBuilder使用基本结构，StreamBuidler基于dart中的异步核心之一Stream，采取观察者模式，发送方通过StreamControll发送数据，观察对象接收到数据后构建自己的内容...在key1的点击事件中往Stream中add数据，这样在key1的流上产生了一条数据，对应的监听者收到数据后，只更新自己的内容，不会重建其他区域。 ? ? ?

2.4K4 1

Flutter实现局部刷新

在Flutter中，如果我们想要更新页面中的某个widget的状态的话，一般会使用setState方法重走build方法来刷新。当页面布局复杂的时候，这样肯定是不行的。...下面提供了两种局部刷新的方式，通过provider和StreamBuilder来实现局部刷新 1、通过provider刷新首先在pubspec.yaml中添加provider依赖 # provider...通过在TimerModel中调用notifyListeners();实现刷新的效果。...2、StreamBuilder实现局部刷新 import 'package:flutter/material.dart'; import 'dart:async'; import 'package:rxdart...StreamBuilder来局部刷新，通过sink.add方法向streamController.sink中添加一个事件流，这个流会被StreamBuilder中stream接收，然后触发builder

3.6K4 2

Flutter ——状态管理 | StreamBuild

Stream可以接受任何类型的数据，值、事件、对象、集合、映射、错误、甚至是另一个Stream，通过StreamController中的sink作为入口，往Stream中插入数据，然后通过你的自定义监听...如果你需要对输出数据进行处理，可以使用StreamTransformer，它可以对输出数据进行过滤、重组、修改、将数据注入其他流等等任何类型的数据操作。...} return ...没有数据的时候返回的控件 }, ) 下面是一个模仿官方自带demo“计数器”的一个例子，使用了StreamBuilder，而不需要任何setState...StreamBuilder构造器 child: StreamBuilder( // 监听Stream，每次值改变的时候，更新Text中的内容 stream...2.方法二使用状态管理bloc,如果使用了bloc,streamBuild中的stream 就因该传bloc的数据，如果我其它地方使用也使用了这个item,那么这个stream就应该传

2.7K3 1

开篇：通过 state 阐述 React 渲染

State setter 函数更新变量（状态发生改变）并触发 React 再次渲染组件。 useState Hook 提供了这两个功能： State 变量用于保存渲染间的数据。...一个 state 变量的值永远不会在一次渲染的内部发生变化，即使其事件处理函数的代码是异步的。它的值在 React 通过调用组件“获取 UI 的快照”时就被“固定”了。...组件会在其 JSX 中返回一张包含一整套新的 props 和事件处理函数的 UI 快照，其中所有的值都是根据那一次渲染中 state 的值2 被计算出来的！...下述例子，更容易说明上述「快照」的含义。点击一次按钮，alert 弹出 0 而不是 5。...要在一个事件中多次更新某些 state，你可以使用 setNumber(n => n + 1) 更新函数。

400 0

Flutter中的状态管理

Flutter将组件分为StatefulWidget，StatelessWidget，自然有状态的组件使用继承Flutter将组件为StatefulWidget。...InheritedWidget的类中，然后在使用的组件widget中直接取用就是。...正如React中有基于context的社区库Redux，正式使用时候InheritedWidget相对比较基础，你需要写一大堆模版类的代码来满足需求，因此推荐使用flutter社区的库scoped_model...引用前端届的RxJS来说： Observable = lodash for async Flutter的官方语言Dart中内置了Stream的概念 Stream ~= Observable...因此不言而喻，就是将需要需要管理的State转化为Stream，然后使用Flutter官方的StreamBuilder来订阅所需要数据源，方便快捷，高效。

1.2K1 0

Flutter响应式编程：Streams和BLoC

如何基于由Stream提供的数据构建Widget？ Flutter提供了一个非常方便的StatefulWidget，称为StreamBuilder。...可能使用此信息的地方（无处，同一页面，另一个页面，或者几个页面...），当这些信息可能被使用时（几乎是直接，几秒钟之后，永远不会......）。 .........它给你：构建仅负责特定活动的部分应用程序的机会，轻松模拟一些组件的行为，以允许更完整的测试覆盖，轻松重用组件（当前应用程序或其他应用程序中的其他位置），重新设计应用程序，并能够在不进行太多重构的情况下将组件从一个地方移动到另一个地方...现在如果你需要更改业务逻辑，您只需更新方法_handleLogic（第77-80行）。也许新的业务逻辑会要求做非常复杂的事情...... CounterPage永远不会知道它，这非常好！...此外，由于Dart中没有类析构函数，因此你永远无法正确释放资源。作为局部变量你可以实例化BLoC的局部实例。在某些情况下，此解决方案完全符合某些需求。

4.1K9 0

Flutter状态管理(2)——单Stream和广播Stream

在Flutter状态管理(1)——InheritedWidget中介绍了状态管理以及如何使用InheritedWidget来实现全局状态的管理。这篇博客将介绍如何使用Stream来实现状态管理。...单Stream Flutter中的StreamBuilder组件封装了Stream，可以根据不同的状态创建不同的Widget。...，那么StreamBuilder函数将会收到数据，显示文本，而一开始没有收到数据，就会显示菊花。...使用Stream进行全局状态的管理，有很大的局限性。因为这依赖于监听者的存在，而如果这个监听的页面还没出现或不在内存中，那么该页面的数据从哪里来呢？...参考 Using StreamBuilder in Flutter Flutter中的状态管理

2.2K4 1

让Flutter 应用程序性能提高 10 倍的 10 个技巧

RepaintBoundary( child: MyExpensiveWidget(), ); ---- 使用 InheritedWidget 获取数据将“InheritedWidget”用于向下传递到小部件树的数据...“InheritedWidget”是一种特殊的小部件，可用于将数据向下传递到小部件树中，这有助于减少重建次数并提高性能。...“StreamBuilder”允许您在更新发生时接收更新，这有助于减少重建次数并提高性能。...使用“PerformanceOverlay”小部件查看应用程序性能的实时可视化。此小部件可以帮助您识别应用程序中可能导致性能问题的区域，并为您提供有关如何优化它们的想法。...flutter run --profile 或者 flutter run --release 请注意，这些只是代码的示例。

7392 1

2022-01-17: flutter weekly第3期

这篇教程像我们介绍了如何使用简单使用Navigator 2.0 API的Auto Router 。如果你现在仍在使用 Navigator 1.0，可以尝试一下新的用法。...在这个简短的教程中，Suragch 为我们介绍了 Flutter 包管理中相对导入和绝对导入的优缺点。最好的建议：保持统一。...With Flutter & Firestore....介绍了flutter如何连接firestore ，并且用firestore创建和保存用户数据。地址：https://www.youtube.com/watch?...关于flutter中使用firebase的视频，大家也可与看我写的一篇教程。地址：https://www.youtube.com/watch?

4.6K1 0

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

的使用详情 | StreamBuilder组件的结合使用 | StreamBuilder 实现的倒计时进度圆圈 EventBus (不考虑使用) Bloc BLoC 异步通信、BlocBuilder...在Flutter项目开发中，一般的项目中，会有网络请求的代码与Widget构建的UI界面写一起，随着业务的不断积累，代码量也越来越大，维护的复杂度也会随着增加。...[在这里插入图片描述] 使用BloC模式，Flutter项目应用里的所有组件都在一个事件流，其中一部分组件可以订阅事件，另一部分组件则消费事件 [在这里插入图片描述] *** 2 BloC 的基本使用...intl.dart'; ///需要添加 intl 依赖 String formatTime = DateFormat("HH:mm:ss").format(dateTime); ///发射更新数据...yield formatTime; } } [在这里插入图片描述] 3 BlocBuilder BlocBuilder与StreamBuilder的作用一样，用来消费事件结果，就是显示数据结果

3.2K1 1

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭