如何避免Flutter StreamBuilder跳过数据？

你遇到的核心问题是Flutter的渲染调度机制和StreamBuilder的更新逻辑共同导致的：

• 默认StreamController在同一事件循环帧内连续发送的事件，会被Flutter合并更新请求，只触发一次StreamBuilder的builder方法。你的_incrementCounter在同步调用里连续执行两次ctrl.add()，两次事件被合并后，builder只会拿到最后一次的事件数据（也就是2、4、6）。
• 另外，你在builder方法里直接修改State的_text变量是错误做法——builder会在组件重建、布局变化等场景下重复调用，这会导致_text被重复追加，数据逻辑混乱。

要实现连续发送多数据且不丢失的需求，有两种可靠做法：

方法1：使用Stream的scan操作符累积数据（推荐） #

把数据累积逻辑放在Stream层面，既保证所有事件都被处理，也符合StreamBuilder的设计规范：

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:rxdart/rxdart.dart'; // 需要在pubspec.yaml添加rxdart依赖

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Flutter Demo',
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  final StreamController<int> ctrl = StreamController<int>();
  late Stream<String> textStream;

  @override
  void initState() {
    super.initState();
    // 用scan操作符自动累积每次事件数据
    textStream = ctrl.stream.scan((accumulatedText, currentValue, _) {
      return '$accumulatedText$currentValue;';
    }, '');
  }

  void _incrementCounter() {
    _counter++;
    ctrl.add(_counter);
    _counter++;
    ctrl.add(_counter);
  }

  @override
  void dispose() {
    ctrl.close(); // 务必关闭StreamController避免内存泄漏
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: StreamBuilder<String>(
        stream: textStream,
        initialData: '',
        builder: (context, snapshot) {
          return Text(snapshot.data ?? '');
        },
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        child: const Icon(Icons.add),
      ),
    );
  }
}

方法2：将每个add操作放入微任务队列 #

如果不想引入第三方依赖，可以通过Future.microtask把每次add拆分到不同微任务中，避免事件被合并：

void _incrementCounter() {
  _counter++;
  Future.microtask(() => ctrl.add(_counter));
  _counter++;
  Future.microtask(() => ctrl.add(_counter));
}

这种方法能让两次add触发独立的更新，但仍依赖State变量_text，存在builder重复执行导致数据异常的风险，因此更推荐方法1。

• 禁止在StreamBuilder的builder方法中修改State变量，builder应该是纯函数，仅根据snapshot数据返回Widget。
• 使用StreamController后，必须在dispose方法中关闭它，防止内存泄漏。

内容的提问来源于stack exchange，提问作者thmint