flutter - 从 future 的功能中获取数据到文本小部件

Question

我正在尝试使用 Text 实现一个 Column:

Column(
        children: <Widget>[
        Text('data from future function')
      ],
    ), 

我无法从 initState() 获取数据，因为 initState() 它只是 void如果我直接从函数中获取数据

Text(function)

我明白了

instance of function

函数:

Future<double> calculate(int index) async {
    LocData _getUser = await getLoc();
    double uLat = _getUser.latitude;
    double uLng = _getUser.latitude;
    double pLat = parks[data].loc.lat;
    double pLng = parks[data].loc.lng;


    double dis = await Geolocator()
        .distanceBetween(uLat , uLng, uLng , pLat );
    return dis ;
  }

知道我该怎么做才能将这些数据从函数直接获取到文本 wigdet 吗？

Answer 1

有两种方法可以从 future 获取数据。

选项 #1:

(有 2 个子选项)

class MyWidgetState extends State<MyWidget> {

  String _someAsyncData;

  @override
  void initState() {
    super.initState();

    // opt 1.
    aDataFuture.then((val) {  
      setState(() {
        _someAsyncdata = val;
      });
    });      

    // opt 2.
    _setAsyncData(aDataFuture);
  }

  void _setAsyncData(Future<String> someFuture) async {
    // void + async is considered a "fire and forget" call
    // part of opt. 2
    _someAsyncData = await someFuture;
    // must trigger rebuild with setState
    setState((){});
  }


  Widget build(BuildContext context) {
    return _someAsyncData == null ? Container() : Text('$_someAsyncData');
  }
}

选项 #2

使用FutureBuilder

class MyWidget extends StatelessWidget {

  Widget build(BuildContext context) {
    return FutureBuilder<String>(
      future: _someFuture,
      builder: (ctx, snapshot) {
        // can also check for snapshot.hasData or snapshot.hasError to
        // provide more user feedback eg.
        if(snapshot.connectionState == ConnectionState.done) 
          return Text('${snapshot.data}');        
        return Text('No data available yet...');
      }
    );
  }

}