Flutter中如何解决‘Map<String,dynamic>?无法赋值给Map<String,dynamic>’错误

错误原因 #

Firestore的DocumentSnapshot.data()方法返回Map<String, dynamic>?——当目标文档不存在时，该值会为null。但你的Articles.fromJson方法要求传入非空的Map<String, dynamic>，因此出现类型不兼容的错误。

解决方案 #

方案1：先校验文档存在性（推荐） #

先判断文档是否存在，避免将null传入fromJson，同时处理文档不存在的场景：

Future<void> getArticle() async {
  final id = widget.id;
  final reference = FirebaseFirestore.instance.doc('articles/$id');
  final snap = await reference.get();

  if (snap.exists) {
    final result = Articles.fromJson(snap.data()!); // 已确认文档存在，data不会为null
    setState(() {
      oneArticle = result;
      loading = false;
    });
  } else {
    // 处理文档不存在的情况，比如提示用户
    setState(() {
      loading = false;
    });
    ScaffoldMessenger.of(context).showSnackBar(
      const SnackBar(content: Text('该文章不存在')),
    );
  }
}

方案2：修改模型类的fromJson方法支持可空参数 #

若允许模型类接收null，可修改Articles.fromJson的参数类型，内部处理null场景：

// 在articlesModel.dart中修改
class Articles {
  // 类成员定义...
  factory Articles.fromJson(Map<String, dynamic>? json) {
    if (json == null) {
      // 返回默认实例或抛出错误，按需选择
      return Articles(url: '', topic: '', description: '');
    }
    return Articles(
      url: json['url'] ?? '',
      topic: json['topic'] ?? '',
      description: json['description'] ?? '',
    );
  }
}

修改后原调用代码可保留，但需注意处理null带来的默认值问题。

额外优化：修复Build方法的空安全问题 #

原代码直接使用oneArticle!会在加载状态或文章不存在时触发空指针异常，建议加入状态判断：

@override
Widget build(BuildContext context) {
  double height = MediaQuery.of(context).size.height;
  double width = MediaQuery.of(context).size.width;
  return Scaffold(
    body: loading 
        ? const Center(child: CircularProgressIndicator())
        : oneArticle == null 
            ? const Center(child: Text('文章不存在'))
            : Column(
                children: [
                  Image.network(
                    oneArticle!.url,
                    height: 30,
                    fit: BoxFit.cover,
                  ),
                  Text(oneArticle!.topic,
                      style: const TextStyle(
                          fontSize: 20,
                          color: Colors.black54,
                          fontWeight: FontWeight.w500)),
                  Text(oneArticle!.description,
                      style: const TextStyle(
                          fontSize: 20,
                          color: Colors.black54,
                          fontWeight: FontWeight.w500)),
                ],
              ),
  );
}

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