颤抖的未来和状态

Question

当我获得API调用的结果时，我试图添加一个Image小部件。我的代码是：

class AnimalDetailsPage extends StatefulWidget {
  final selection;

  _AnimalDetailsPage createState() => new _AnimalDetailsPage();
  AnimalDetailsPage({Key key, this.selection}) : super(key: key);
}

class _AnimalDetailsPage extends State<AnimalDetailsPage> {

  Future<List> getphotos(horseId) async {
    http.Response response = await http.get(
        Uri.encodeFull(
            "http://myhorses.com/api/getHorsePhotos?horse_id=" +
                horseId));
    return JSON.decode(response.body);
  }

  @override
  Widget build(BuildContext context) {

    final menu = new MyMenuBar();

    List<Widget> bodyContent = [menu];
    dynamic body = new Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: bodyContent,
    );

    if (widget.selection != null) {
      final horse = widget.selection;
      getphotos(horse['id'].toString()).then((res) {
        setState(() {
          bodyContent.add(new Image.network(res[0]['image']));
        });
      });

    } 

    return Scaffold(
      body: body,
    );
  }
}

我无法理解的是setState不会更新视图。如果我将setState从then语句中移出并对图像src进行硬编码，那么它将正常工作。

Answer 1

bodyContent 在里面声明 build()

  @override
  Widget build(BuildContext context) {

    final menu = new MyMenuBar();

    List<Widget> bodyContent = [menu];
    ...
    bodyContent.add(new Image.network(res[0]['image']));
    ...

并setState()导致build再次执行，这意味着bodyContent保存图像的会被丢弃并创建一个新的图像。

移动List<Widget> bodyContent = [menu];出的build()方法，使之类级别字段，你应该得到期望的结果。