Flutter中如何在详情页获取Firestore文档的Todo实例ID？

方法一：给Todo类添加文档ID字段（推荐） #

首先修改Todo类，新增存储Firestore文档ID的字段，并在从Firestore转换实例时带上文档ID：

class Todo {
  final String documentId;
  final String title;
  final String description;

  Todo({
    required this.documentId,
    required this.title,
    required this.description,
  });

  // 从Firestore文档生成Todo实例时，提取文档ID
  factory Todo.fromFirestore(DocumentSnapshot doc) {
    final data = doc.data() as Map<String, dynamic>;
    return Todo(
      documentId: doc.id,
      title: data['title'] ?? '',
      description: data['description'] ?? '',
    );
  }
}

在列表页跳转到详情页时，直接传递包含文档ID的Todo实例：

Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => const DetailScreen(),
    arguments: todo, // 此处的todo已包含documentId
  ),
);

最后在详情页就能直接访问文档ID：

const DetailScreen({super.key});

@override
Widget build(BuildContext context) {
  final todo = ModalRoute.of(context)!.settings.arguments as Todo;

  // 直接获取文档ID
  final docId = todo.documentId;

  return Scaffold(
    appBar: AppBar(
      title: Text(todo.title),
    ),
    body: Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text('文档ID: $docId'),
          const SizedBox(height: 16),
          Text(todo.description),
        ],
      ),
    ),
  );
}

方法二：单独传递文档ID（无需修改Todo类） #

如果不想改动Todo类，可以在跳转时传递一个包含Todo和文档ID的Map：

// 列表页跳转代码
Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => const DetailScreen(),
    arguments: {
      'todo': todo,
      'documentId': doc.id, // doc是Firestore的DocumentSnapshot实例
    },
  ),
);

然后在详情页解析参数获取文档ID：

const DetailScreen({super.key});

@override
Widget build(BuildContext context) {
  final args = ModalRoute.of(context)!.settings.arguments as Map<String, dynamic>;
  final todo = args['todo'] as Todo;
  final docId = args['documentId'] as String;

  return Scaffold(
    appBar: AppBar(
      title: Text(todo.title),
    ),
    body: Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text('文档ID: $docId'),
          const SizedBox(height: 16),
          Text(todo.description),
        ],
      ),
    ),
  );
}

两种方法都能实现需求，第一种将文档ID与Todo数据绑定，逻辑更连贯，更推荐使用。

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