Flutter：使用Provider时Text Widget无法随值更新

核心原因 #

你使用Provider.of<SyncProvider>(context, listen: false)获取进度值时，listen: false会让Widget仅在初始化时获取一次值，不会监听Provider的状态变化，所以后续currentSyncProgress更新后，Text组件不会重新渲染。

解决方案 #

方案1：开启Provider监听

将listen参数改为true，让Widget监听Provider的状态变化，进度更新时自动重建Text：

DefaultTextStyle(
  style: TextStyle(
      fontSize: isMobile ? 9 : 15,
      color: const Color.fromARGB(221, 80, 79, 79),
      fontWeight: FontWeight.w900),
  child: Text(
      "Sync ${ Provider.of<SyncProvider>(context, listen: true).currentSyncProgress} of 10")),

方案2：使用Consumer组件（推荐）

用Consumer包裹Text组件，仅让Text部分在状态变化时重建，性能更优：

DefaultTextStyle(
  style: TextStyle(
      fontSize: isMobile ? 9 : 15,
      color: const Color.fromARGB(221, 80, 79, 79),
      fontWeight: FontWeight.w900),
  child: Consumer<SyncProvider>(
    builder: (context, syncProvider, child) {
      return Text("Sync ${syncProvider.currentSyncProgress} of 10");
    },
  ),
),

额外注意事项 #

确保你的SyncProvider在更新currentSyncProgress时调用了notifyListeners()，否则即使开启监听，Widget也不会收到更新通知：

class SyncProvider extends ChangeNotifier {
  int _currentSyncProgress = 0;
  int get currentSyncProgress => _currentSyncProgress;

  void updateProgress(int newProgress) {
    _currentSyncProgress = newProgress;
    notifyListeners(); // 必须调用此方法触发UI更新
  }
}

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