Flutter异步方法返回小部件不起作用答案

【问题标题】：Flutter Async Method returning widget not workingFlutter异步方法返回小部件不起作用
【发布时间】：2020-03-11 21:02:27
【问题描述】：

在我的代码中，我想根据条件显示浮动操作按钮。该条件是基于 HTTP 调用评估的，根据 Flutter，该调用本质上是异步的。我下面的代码没有返回任何东西。

 Widget _getFAB() {
    var Data = GetDetailsFromHTTP();

    userJSON.then((Data ) {
      if (1 == 2) {
        return Container();
      } else {
        return FloatingActionButton(
            backgroundColor: Colors.deepOrange[800],
            child: Icon(Icons.add_shopping_cart),
            onPressed: null);
      }
    });
  }

Await 也不起作用，因为它不允许将返回类型作为小部件。如何创建等待异步调用并返回小部件的方法？

【问题讨论】：

您可能想使用FutureBuilder。

标签： flutter

【解决方案1】：

您在非异步方法中使用异步方法

Widget _getFAB() async {
  var Data = GetDetailsFromHTTP();

  return await userJSON.then((Data ) {
    if (1 == 2) {
      return Container();
    } else {
      return FloatingActionButton(
          backgroundColor: Colors.deepOrange[800],
          child: Icon(Icons.add_shopping_cart),
          onPressed: null);
    }
  });
}

最佳方式：更喜欢使用 FutureBuilder，这就是这样做的目的。 https://api.flutter.dev/flutter/widgets/FutureBuilder-class.html

例如：

FutureBuilder<String>(
future: _calculation, // a previously-obtained Future<String> or null
builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
  switch (snapshot.connectionState) {
    case ConnectionState.none:
      return Text('Press button to start.');
    case ConnectionState.active:
    case ConnectionState.waiting:
      return Text('Awaiting result...');
    case ConnectionState.done:
      if (snapshot.hasError)
        return Text('Error: ${snapshot.error}');
      return Text('Result: ${snapshot.data}');
  }
  return null; // unreachable
  })

【讨论】：