Flutter - 从函数而不是值返回的 Future<int> 的实例

Flutter - Instance of Future<int> returned from the function instead of the value

在提供打印功能的代码中 returns 应该打印正确的朋友数量,但是当我尝试 return 它时,它 returns (实例未来 ) 而不是 return 实际值(数字)

Future<int> FriendsNumber() async {
  final count = await _firestore
      .collection('FriendsList')
      .doc(User.userID)
      .collection("FriendsList")
      .where("Status", isEqualTo: 1)
      .get()
      .then((res) => res.size);
  print('number of friends is:');
  print(count);
  return count;
}

return Scaffold(
  body: Column(
    children: [
      Text(
        FriendsNumber().toString();
      ),
    ],
  ),
);

你必须为此使用未来的构建器

  class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: Scaffold(   
            body: FutureBuilder<int>(
          future: FriendsNumber(),
          builder: (BuildContext context,  snapshot) {
            if (!snapshot.hasData) {
              // while data is loading:
              return Center(
                child: CircularProgressIndicator(),
              );
            } else {
              // data loaded:
              final friendNumber= snapshot.data;
              return Center(
                child: Text('Friends are: $friendNumber'),
              );
            }
           },
          ),
         ),
        );
      }
    }

这就是 asyncawait 在 Dart 中的工作方式。 await 通过允许异步代码以与同步代码非常相似的方式执行,从而允许异步函数具有同步函数的外观。代码中的这一行推迟了此函数的进一步执行,直到 firestore 查询的结果为 returned:

final count = await _firestore
      .collection('FriendsList')
      .doc(User.userID)
      .collection("FriendsList")
      .where("Status", isEqualTo: 1)
      .get()
      .then((res) => res.size);

因为 dart 在这里没有阻塞它必须 return 一些值,在本例中是 Future<int>,这基本上意味着在 Future 中这将被解析为int 值。

您的打印语句在 await 之后(当 firestore 的结果得到 returned 时,执行将再次开始)因此可以直接使用值。

如果不使用 FutureBuilder 小部件,则无法提取 Future 的值。

如果这是您只需要一次且不会更改的数据,您可以在 initState() 方法中调用 Future 方法,如下所示:

@override
void initState() {
  super.initState();
FriendsNumber().then((value) {
 setState(() {
   count = value; //here you can continue your filter logic, ex: value.contains etc...
   });
 });
}

这样做将使您能够像在 post 中显示的那样显示数据。

return Scaffold(
  body: Column(
    children: [
      Text(
        count.toString();
      ),
    ],
  ),
);