0

我尝试按照 Flutter 文档中的 Future builder 小部件指南进行操作。

但是，当我进行 fetch 调用并尝试显示信息时，我得到了 'Snippet' 的实例。

我注意到，当我 jsonDecode(res.body) 正确显示响应的 JSON 时，但是当我通过 Snippet.fromJson 运行它并返回它时，我得到'Snippet'的实例。

这是我创建类的代码，在它下面是我调用它的地方。

import 'dart:convert';

import 'package:flutter/foundation.dart';
import 'package:http/http.dart' as http;

class SnippetProvider extends ChangeNotifier {
  final String snippetUrl = 'https://endpoint';

  Future<Snippet> getSnippets() async {
    final res = await http.get(snippetUrl);
    if (res.statusCode == 200) {
      debugPrint('data: ${jsonDecode(res.body}'); //correct info 
      return Snippet.fromJson(jsonDecode(res.body));
    } else {
      throw "No snippets available";
    }
  }
}

class Snippet {
  final int book;
  final String title;
  final String list;
  final String body;

  Snippet({this.book, this.title, this.list, this.body});

  factory Snippet.fromJson(Map<String, dynamic> json) {
    return Snippet(
      book: json['book'] as int,
      title: json['title'] as String,
      list: json['list'] as String,
      body: json['body'] as String,
    );
  }
}

class _ShareState extends State<Share> {
  Future<Snippet> snippets;
  Future<Snippet> _future;
  var checkboxStatus = false;
  var snippetsToBeShared;
  final SnippetProvider method = new SnippetProvider();

  @override
  void initState() {
    snippetsToBeShared = new List();
    super.initState();
    snippets = pdfSnippets();
  }

  Future<Snippet> pdfSnippets() async {
    final data = await method.getSnippets();
    debugPrint('data: $data');
    //! this code breaks the app
    // data is an obj with nested objs
    // setState(() => {
    //       processedSnippets.add(data),
    //       processedSnippets[0]
    //           .map((snippet) => processedSnippets.add(snippet))
    //     });
    return data;
  }
        child: FutureBuilder<Snippet>(
          future: snippets,
          builder: (BuildContext context, AsyncSnapshot snapshot) {
            if (snapshot.hasData) {
              return ListView.builder(
                  //* will have to hide the eccess snippet with overflow
                  //? and have a max width to fit the trailing checkbox
                  itemBuilder: (BuildContext context, int index) {
                return ListTile(
                  title: Text('${snapshot.data.body}'),
                  subtitle: Text('${snapshot.data.title}'),
                  [...]
)
4

1 回答 1

1

jsonDecode 解析字符串并返回结果 Json 对象。所以你会在调试控制台中看到解析后的 Json 对象。然后你用 fromJson(jsonDecode(res.body)) 构造 Snipped 对象，你得到真正的 Snippet 对象而不是 Json 对象。你会得到'片段的实例。

于 2021-01-05T20:06:28.937 回答