如何检查 Flutter 中的 Future 变量是否已更改？

Question

我正在用 Flutter 制作一个移动应用程序，这让我在很长一段时间内无法取得进展，所以我想我应该问问 Whosebug！

我有一个在 Future 函数中声明的变量，我主要想做的是：检查变量（它是一个数组）是否已被填充，如果是则显示结果，如果没有则显示结果显示圆形进度条。我已经完成了大部分代码，但是当它检查变量值时，它总是说它等于零，并且它一直显示循环进度条！使值出现的唯一方法是使用应用程序中包含的“搜索”或根本不包含此“如果”！

这是用于启动 _posts 变量的函数的代码，它会在应用程序启动时被调用。

Future<void> fetchPosts([String tags]) async {
    var result;
    if (tags != null) {
      apiUrl += tags;
      result = await http.get(apiUrl);
      setState(() {});
    } else {
      result = await http.get(apiUrl);
      setState(() {});
    }
    _posts = json.decode(result.body);
  }

这是显示所有内容的小部件的代码。

Widget build(BuildContext context) {
    return Scaffold(
        appBar: _messageSelected
            ? _defaultBar(context, appBarChange)
            : _editingBar(context, appBarChange),
        body: Container(
            child: _posts.length != 0
                   ^^^^^^^^^^^^^^^^^^
                ? RefreshIndicator(
                    child: GridView.count(
                        crossAxisCount: 2,
                        children: List.generate(_posts.length, (index) {
                          return InkWell(
                              onTap: () {
                                Navigator.push(
                                  context,
                                  MaterialPageRoute(
                                    builder: (context) => DetailScreen(),
                                    settings: RouteSettings(
                                      arguments: _posts[index],
                                    ),
                                  ),
                                );
                              },
                              child: Image.network(
                                _url(_posts[index]),
                                width: 270,
                                height: 270,
                                fit: BoxFit.cover,
                              ));
                        })),
                    onRefresh: () {
                      return _getData();
                    })
                : Center(child: CircularProgressIndicator())));
  }

（我突出显示了它检查变量的部分，也许有一种方法可以在其中放置一个“while”？）
我如何让它在这里再次检查变量 : Center(child: CircularProgressIndicator()))); 并显示正确的值？

我已经为此苦苦挣扎了一段时间，如有任何帮助、建议或反馈，我们将不胜感激！提前致谢。

Answer 1

不是直接在函数内调用 setState，您需要为此使用 FutureBuilder，它会监听传递给 future: 参数的方法的变化，然后设置相应的状态。

对于您的情况，要实现此功能，您首先需要修改 future 方法

Future fetchPosts([String tags]) async {
    var result;
    if (tags != null) {
      apiUrl += tags;
    }
    result = await http.get(apiUrl);
    _posts = json.decode(result.body);

   return Future.value(_posts);
  }

然后用 FutureBuilder

包装您的小部件

...

body:Container(
  child: FutureBuilder(
  future:fetchPosts(..args),
  builder:(BuildContext context, AsyncSnapshot snapshot){

       if(!snapshot.hasData) return CircularProgressIndicator();

       if(snapshot.hasError) return Text("Something went wrong");

       return YourScreenWidget()
    }
  )
)

您可以在 flutter 文档 here

中阅读有关 FutureBuilder 的更多信息

如何检查 Flutter 中的 Future 变量是否已更改？

How to check if a Future variable has changed in Flutter?

android

asynchronous

future

dart

flutter