如何在顫動中將物件從頁面傳遞到另一個頁面？

我使用模型類從firestore獲取文章串列，如串列視圖。如果用戶選擇查看按鈕，我想這樣做應該只顯示一篇文章。為此，我想將文章 ID 從所有文章頁面傳遞到另一個頁面。

例如：用戶選擇文章 1 查看按鈕然后應該傳遞文章 1 Id 以查看我嘗試過的一篇文章頁面，但顯示了一些錯誤。在導航器

代碼

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:neerogi/screens/Articles/Admin/viewOne_articles.dart';

import '../articlesModel.dart';

class ViewArticlesScreens extends StatefulWidget {
  const ViewArticlesScreens({Key? key}) : super(key: key);

  @override
  State<ViewArticlesScreens> createState() => _ViewArticlesScreensState();
}

class _ViewArticlesScreensState extends State<ViewArticlesScreens> {
  @override
  Future<List<Articles>> fetchRecords() async {
    var records = await FirebaseFirestore.instance.collection('articles').get();
    return mapRecords(records);
  }

  List<Articles> mapRecords(QuerySnapshot<Map<String, dynamic>> records) {
    var _list = records.docs
        .map(
          (article) => Articles(
            id: article.id,
            topic: article['topic'],
            description: article['description'],
            url: article['url'],
          ),
        )
        .toList();

    return _list;
  }

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    double height = MediaQuery.of(context).size.height;
    double width = MediaQuery.of(context).size.width;
    return Scaffold(
      body: Column(
        children: [
          SingleChildScrollView(
            child: Column(
              
              children: <Widget>[
                const SizedBox(height: 10),
                SizedBox(
                    width: width * 0.94,
                    height: height * 0.90,
                    child: FutureBuilder<List<Articles>>(
                        future: fetchRecords(),
                        builder: (context, snapshot) {
                          if (snapshot.hasError) {
                            return Text('Error: ${snapshot.error}');
                          } else {
                            List<Articles> data = snapshot.data ?? [];

                            return ListView.builder(
                                itemCount: data.length,
                                itemBuilder: (context, index) {
                                  return (SizedBox(
                                    height: 100,
                                    child: Column(
                                      children: <Widget>[
                                        ListTile(
                                            leading: Image.network(
                                              data[index].url,
                                              height: 30,
                                              fit: BoxFit.cover,
                                            ),
                                            title: Text(data[index].topic),
                                            subtitle:
                                                Text(data[index].description),
                                            trailing: ElevatedButton(
                                              child: Text('View'),
                                              onPressed: () {
                                                Navigator.of(context).push(
                                                    MaterialPageRoute(
                                                        builder: (context) =>
                                                            ViewOneArticleScreen(
                                                              id: article.id,
                                                            )));
                                              },
                                            ))
                                      ],
                                    ),
                                  ));
                                });
                          }
                        }))
              ],
            ),
          ),
        ],
      ),
    );
  }
}

模型

import 'dart:convert';

Articles articlesFromJson(String str) => Articles.fromJson(json.decode(str));

String articlesToJson(Articles data) => json.encode(data.toJson());

class Articles {
  Articles({
    required this.id,
    required this.url,
    required this.topic,
    required this.description,
  });
  String id;
  String topic;
  String description;
  String url;

  factory Articles.fromJson(Map<String, dynamic> json) => Articles(
        id: json["id"] ?? "",
        topic: json["topic"] ?? "",
        description: json["description"] ?? "",
        url: json["url"] ?? "",
      );

  Map<String, dynamic> toJson() => {
        "id": id,
        "topic": topic,
        "description": description,
        "url": url,
      };
}

查看一篇文章頁面

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

import '../articlesModel.dart';

class ViewOneArticleScreen extends StatefulWidget {
  const ViewOneArticleScreen({Key? key}) : super(key: key);

  @override
  State<ViewOneArticleScreen> createState() => _ViewOneArticleScreenState();
}

class _ViewOneArticleScreenState extends State<ViewOneArticleScreen> {
  Future<List<Articles>> fetchRecords() async {
    var records = await FirebaseFirestore.instance.collection('articles').get();
    return mapRecords(records);
  }

  List<Articles> mapRecords(QuerySnapshot<Map<String, dynamic>> records) {
    var _list = records.docs
        .map(
          (article) => Articles(
            id: article.id,
            topic: article['topic'],
            description: article['description'],
            url: article['url'],
          ),
        )
        .toList();

    return _list;
  }

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    double height = MediaQuery.of(context).size.height;
    double width = MediaQuery.of(context).size.width;
    return Scaffold(
      body: Column(
        children: [
          Image.network(
            data[index].url,
            height: 30,
            fit: BoxFit.cover,
          ),
          Text($topic),
          Text($description),
        ],
      ),
    );
  }
}

錯誤

uj5u.com熱心網友回復：

該錯誤是預期的，因為您沒有id在ViewOneArticleScreen. 為了使它作業，像這樣定義它

class ViewOneArticleScreen extends StatefulWidget {
  const ViewOneArticleScreen({Key? key, required this.id}) : super(key: key);
  final String id;

  @override
  State<ViewOneArticleScreen> createState() => _ViewOneArticleScreenState();
}

之后，您現在可以像這樣在小部件中使用：print(widget.id)

標籤：Google Cloud Collective 扑谷歌云火库

上一篇：如何在從資料庫中獲取資料之后而不是之前運行IF條件？

下一篇：Flutter凍結將List轉換為json