Flutter使用GetX实现点击书籍跳转详情页及展示对应信息方法

实现步骤 #

1. 接收跳转携带的书籍参数
   你在调用Get.to()时已经通过arguments传入了当前点击的书籍文档，在showBookDetails组件中直接通过Get.arguments即可获取该参数。
2. 完善详情页布局，渲染对应字段
   拿到参数后直接读取文档内的字段，放到你需要的布局位置即可。

完整代码示例 #

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

Widget showBookDetails() {
  // 接收传递过来的书籍文档
  final DocumentSnapshot book = Get.arguments;

  return Scaffold(
    appBar: AppBar(
      title: const Text('书籍详情'),
      backgroundColor: Colors.white,
    ),
    body: Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          // 展示书名
          Text(
            book['Title'],
            style: const TextStyle(
              fontSize: 28,
              fontWeight: FontWeight.bold,
            ),
          ),
          const SizedBox(height: 12),
          // 展示作者
          Text(
            '作者：${book['Author']}',
            style: const TextStyle(
              fontSize: 20,
              color: Colors.grey,
            ),
          ),
          const SizedBox(height: 24),
          // 可根据你的实际文档字段继续扩展，比如展示书籍简介、出版社、封面等
          // 示例：展示简介（提前判断字段存在避免报错）
          if((book.data() as Map).containsKey('Desc'))
          Text(
            '书籍简介：${book['Desc']}',
            style: const TextStyle(
              fontSize: 18,
              height: 1.5,
            ),
          ),
        ],
      ),
    ),
  );
}

注意事项 #

• 如果你存储的书籍文档还有其他自定义字段，直接按照book['字段名']的格式读取即可。
• 建议读取字段前先判断字段是否存在，避免因部分文档缺字段导致的崩溃问题。
• 如果你的showBookDetails是单独的Stateless/StatefulWidget类，接收参数的逻辑可以放在build方法里，或者State的initState中都可以。

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