You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Flutter Riverpod Provider不更新UI,仅热重载生效问题求助

问题排查与修复

你的问题核心有两个:状态更新未触发通知,以及Provider定义未适配ChangeNotifier的监听机制。

1. 状态更新后未通知监听者

GeoService继承了ChangeNotifier,但在reverseGeocoding方法中更新_reverseResult后,没有调用notifyListeners()——这是ChangeNotifier通知监听者状态变化的关键方法,缺失它会导致Riverpod无法感知状态更新,自然不会触发UI刷新。

修复reverseGeocoding方法:

Future<void> reverseGeocoding(Map<String?, Object?> data) async {
  try {
    final List<dynamic> coordinates = data['coordinates'] as List<dynamic>;
    final double latitude = coordinates[1] as double;
    final double longitude = coordinates[0] as double;

    final response = await http.get(Uri.parse(
        'https://api.mapbox.com/geocoding/v5/mapbox.places/$longitude,$latitude.json?access_token=${dotenv.get("MAPBOX_ACCESS_TOKEN")}'));

    final decodedResponse = json.decode(response.body);
    final String placeName =
        decodedResponse['features'][0]['place_name'] as String;

    print(placeName);
    _reverseResult = placeName;
    notifyListeners(); // 新增:通知所有监听者状态已更新
  } catch (e) {
    print('Error during reverse geocoding: $e');
  }
}

2. 适配Riverpod对ChangeNotifier的监听

你当前用@riverpod注解生成的是普通Provider,无法正确监听ChangeNotifier的状态变化。需要将Provider改为ChangeNotifierProvider:

替换原来的@riverpod注解代码:

// 移除原来的@riverpod行,替换为以下代码
final geoServiceProvider = ChangeNotifierProvider((ref) => GeoService());

如果你想继续使用Riverpod的注解方式(Riverpod 2.x+),可以改为:

@ChangeNotifierProvider(keepAlive: true)
GeoService geoService(GeoServiceRef ref) {
  return GeoService();
}

验证其他代码

  • MapBoxViewModel中的调用逻辑没问题:ref.read(geoServiceProvider).reverseGeocoding(lnglat); 正确获取了GeoService实例并调用方法。
  • ChargerLocationScreen中ref.watch(geoServiceProvider)的使用正确,修复上述两点后,UI会在状态更新时自动刷新。

内容的提问来源于stack exchange,提问作者nologic

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.02 13:53:31