簡體   English   中英

來自 api 的信息未顯示 - Flutter

[英]Information from api doesn't show - Flutter

我對 Flutter 中的 Future builder 有疑問。 它成功地從 api 獲取信息,但沒有顯示出來。 當我從 api 打印和打印信息時,沒問題,它顯示電影名稱沒有任何問題。 這是我的代碼:

class Search extends StatefulWidget {
  final String value;
  Search({Key key, String this.value}) : super(key: key);
  @override
  _SearchState createState() => _SearchState();
}

class _SearchState extends State<Search> {
  var title;

  Future getSearch({index}) async {
    http.Response response = await http.get(
        'https://api.themoviedb.org/3/search/company?api_key=6d6f3a650f56fd6b3347428018a20a73&query=' +
            widget.value);
    var results = json.decode(response.body);
    setState(() {
      this.title = results['results'];
    });
    return title[index]['name'];
  }

  getName(index) {
    return title[index]['name'];
  }

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
          backgroundColor: Color(0xff1d1d27),
          body: Column(
            children: [
              Expanded(
                  child: FutureBuilder(
                initialData: [],
                future: getSearch(),
                builder: (context, snapshot) {
                  return ListView.builder(itemBuilder: (context, index) {
                    Padding(
                      padding:
                          EdgeInsets.symmetric(horizontal: 30, vertical: 20),
                      child: Container(
                        color: Colors.white,
                        child: Text(getName(index).toString()),
                      ),
                    );
                  });
                },
              ))
            ],
          )),
    );
  }
}

請使用此code ,它可以很好地獲取名稱並將它們顯示在列表中,

import 'dart:convert';

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

class Search extends StatefulWidget {
  final String value;
  Search({Key key, String this.value}) : super(key: key);
  @override
  _SearchState createState() => _SearchState();
}

class _SearchState extends State<Search> {
  var title;
  var results;

  getSearch() async {
    http.Response response = await http.get(
        'https://api.themoviedb.org/3/search/company?api_key=6d6f3a650f56fd6b3347428018a20a73&query=' +
            widget.value);
    results = json.decode(
        response.body); //make it global variable to fetch it everywhere we need
    return results['results'][0]['name'];
  }

  getName(index) {
    return results['results'][index]['name'];
  }

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
          backgroundColor: Color(0xff1d1d27),
          body: Column(
            children: [
              Expanded(
                  child: FutureBuilder(
                // initialData: [],
                future: getSearch(),
                builder: (context, snapshot) {
                  String name =
                      snapshot.data; // to get the data from the getSearch
                  print(name);
                  if (snapshot.hasData) {
                    // if there is data then show the list
                    return ListView.builder(
                        itemCount: results['results']
                            ?.length, // to get the list length of results
                        itemBuilder: (context, index) {
                          return Padding(
                            padding: EdgeInsets.symmetric(
                                horizontal: 30, vertical: 20),
                            child: Container(
                              color: Colors.white,
                              child: Text(getName(index)
                                  .toString()), // pass the index in the getName to get the name
                            ),
                          );
                        });
                  } else {
                    // if there is no data or data is not loaded then show the text loading...
                    return new Text("Loading...",
                        style: TextStyle(fontSize: 42, color: Colors.white));
                  }
                },
              ))
            ],
          )),
    );
  }
}

附言
學習 Futurebuilder 的基礎知識可以看這篇文章 更多學習

我已經評論了代碼以向您解釋更多。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM