Question

我想使用由Widgets填充的LietView.build，它在构建窗口小部件之前从异步方法获取数据。以下是我从网站收集数据的功能：

fetchBasicData(String URL) async {
  final response = await http.get(URL);
  var document = parse(response.body);

  var result = new List<dom.Node>();
  result = document.getElementsByClassName('datas-nev');
  var dogName = result[0].nodes[1].toString();
  result = document.getElementsByClassName('datas-tipus');
  var dogBreed = result[0].nodes[1].toString();
  result = document.getElementsByClassName('datas-nem');
  var dogGender = result[0].nodes[1].toString();
  result = document.getElementsByClassName('datas-szin');
  var dogColor = result[0].nodes[1].toString();
  result = document.getElementsByClassName('datas-kor');
  var dogAge = result[0].nodes[1].toString();

  result = document.getElementsByClassName('pirobox_gall');
  String imageLink;
  imageLink = urlPrefix + result[0].nodes[0].attributes.values.first;

  return new Dog.basic(
      URL,
      dogName,
      dogBreed,
      dogGender,
      dogColor,
      dogAge,
      imageLink);
}

执行该功能并收集数据，但小部件构建失败并显示type '_Future' is not a subtype of type 'Widget' of 'child' where

这是应该构建小部件的函数：

buildBasicWidget(String URL) async {
    Dog myDog = await fetchBasicData(URL);
    return new SizedBox(
      width: 500.0,
      height: 400.0,
      child: new Card(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.start,
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            //Header image row
            new Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                new Expanded(
                    child: new FutureBuilder(
                        future: fetchPortrait(myDog.imageLink),
                        builder: (context, snapshot) {
                          if (snapshot.hasData) {
                            return new Image.network(
                              snapshot.data,
                              fit: BoxFit.scaleDown,
                            );
                          } else {
                            if (snapshot.hasError) {
                              return new Text('Hiba');
                            }
                          }
                          return new Center(
                            child: new CircularProgressIndicator(),
                          );
                        }))
              ],
            ), //Header image row
            new Row(
              children: <Widget>[
                new Expanded(
                    child: new Text(
                  dogName,
                  style: new TextStyle(
                      fontWeight: FontWeight.bold,
                      fontSize: 18.0,
                      color: Colors.black),
                ))
              ],
            ),
            new Row(
              children: <Widget>[
                new Expanded(
                    child: new Text(myDog.dogColor +
                        'színű, ' +
                        myDog.dogBreed +
                        ' ' +
                        myDog.dogGender))
              ],
            ),
            new Row(
              children: <Widget>[
                new Expanded(child: new Text('Kora: kb. ' + myDog.dogAge))
              ],
            )
          ],
        ),
      ),
    );
  }

我也尝试将此函数设置为异步，并等待fetchBasicDetails()完成，因此数据在使用时会出现。

我甚至尝试使用dynamic fetchBasicData(String URL) async {...}，但这也没有帮助。使用Future<Dog>代替dynamic也会导致错误。

如何使buildBasicWidget使用fetchBasicData结果？或者我应该只在fetchBasicData处理小部件构建作为一个简单的解决方法吗？

Answer 1

您需要使用FutureBuilder并在async参数中添加future函数，否则在获取数据之前会调用build方法。

或者在initState内执行异步请求。

Dart / Flutter：使用异步方法

1 个答案: