如何在 Flutter 中使用 API 中的地图数据更新地图答案

【问题标题】：How to update a map with map data from API in Flutter如何在 Flutter 中使用 API 中的地图数据更新地图
【发布时间】：2022-06-12 05:12:49
【问题描述】：

我是 Flutter 的新手，发现很难使用从 API 获得的地图更新 _users。即使 VSCode 中没有显示实际错误，我也会收到构建错误。

这是我的代码。

import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:http/http.dart' as http;

class Users with ChangeNotifier {
  final String id;
  final String firstName;
  final String lastName;
  final String emailAddress;
  final String phoneNumber;
  final String classId;
  final String roleId;
  final String dateCreated;
  final String uid;
  bool isActive;
  final String profilePhoto;

  Users({
    required this.id,
    required this.firstName,
    required this.lastName,
    required this.emailAddress,
    required this.phoneNumber,
    required this.classId,
    required this.roleId,
    required this.dateCreated,
    required this.uid,
    required this.isActive,
    required this.profilePhoto,
  });

  Map<String, Users> _users = {};

  Map<String, Users> get users {
    return {..._users};
  }

  Future<void> fetchUser() async {
    try {
      final String idToken =
          await FirebaseAuth.instance.currentUser!.getIdToken();

      final reauthUrl = Uri.parse(
          'https://example-backend.azurewebsites.net/api/v1/User/reauth');

      final reauthResponse = await http.post(reauthUrl,
          headers: {
            'Content-Type': 'application/json',
            'Accept': 'application/json'
          },
          body: json.encode({"token": idToken}));

      final returnedTokenData =
          json.decode(reauthResponse.body) as Map<String, dynamic>;

      final serverToken = returnedTokenData['token'];

      final url =
          Uri.parse('https://example-backend.azurewebsites.net/api/v1/User');

      final response = await http.get(
        url,
        headers: {'Authorization': 'Bearer $serverToken'},
      );

      final responseData = json.decode(response.body) as Map<String, dynamic>;
      Map<String, dynamic> userData = {};
      userData.update(id, (value) {
        return Users(
          id: responseData['id'],
          firstName: responseData['firstName'],
          lastName: responseData['lastName'],
          emailAddress: responseData['emailAddress'],
          phoneNumber: responseData['phoneNumber'],
          classId: responseData['classId'],
          roleId: responseData['roleId'],
          dateCreated: responseData['dateCreated'],
          uid: responseData['uid'],
          isActive: responseData['isActive'],
          profilePhoto: responseData['profilePhoto'],
        );
      });
      print(userData);

      notifyListeners();
    } catch (error) {
      rethrow;
    }
  }
}

【问题讨论】：

您遇到了什么构建错误？尝试重新加载 vscode，这将导致 dart 分析器重新启动。还要检查你是否没有过滤 vscode 中显示的错误。
不确定这是否会导致任何问题，但userData.update 的使用对我来说似乎真的很奇怪。为什么不只做 userData[id] = Users(...) ？
另外，您应该提前注意到，例如 responseData['id'] 不是一个字符串，它是一个字符串？（可以为空）。如果这些字段中的任何一个为空，那么您的应用在读取 responseData 时应该抛出一个异常并导致您的应用崩溃，因为您的 Users 类中的 id 不能为空
@EricOmine。感谢您的回复。实际上，我通过对 Users 类中的变量添加 null 检查并在构造函数中将 'required' 替换为 '@required' 来消除构建错误。构建错误是由 main.dart 文件在路由表上调用类时需要这些参数的参数引起的。现在的实际问题是代码不能用于更新地图。
方法更新意味着更新映射中的特定值，该值可以通过您在更新方法的第一个参数中传递的键读取。但是你的 userData 是空的，不能更新，因为它没有任何值。

标签： json flutter api dart

【解决方案1】：

解决此问题的一种方法是不使用映射并将 API 中的值直接分配给类中的变量。变量不应该是 final 才能重新赋值给它们。

final responseData = json.decode(response.body) as Map<String, dynamic>;
id = responseData['id'];
      firstName = responseData['firstName'];
      lastName = responseData['lastName'];
      emailAddress = responseData['emailAddress'];
      phoneNumber = responseData['phoneNumber'];
      classId = responseData['classId'];
      roleId = responseData['roleId'];
      dateCreated = responseData['dateCreated'];
      uid = responseData['uid'];
      isActive = responseData['isActive'];
      profilePhoto = responseData['profilePhoto'];

【讨论】：