如何在 Flutter 中异步设置主页？

Question

我正在尝试异步设置 Flutter 应用的主页，但这不起作用，因为 build 方法不能具有异步属性。

class _MyAppState extends State<MyApp> {
  // Widget homeWidget;
  // @override
  // void initState() async {
  //   super.initState();
  //   homeWidget = (await AuthUser.getCurrentUser() != null)
  //       ? NavBarPage()
  //       : OnBoardingWidget();
  // }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'WizTkt',
      theme: Theme.of(context).copyWith(
          appBarTheme: Theme.of(context)
              .appBarTheme
              .copyWith(brightness: Brightness.dark),
          primaryColor: Colors.blue),
      home: (await AuthUser.getCurrentUser() != null)
        ? NavBarPage()
        : OnBoardingWidget(),
    );
  }
}

正如您在代码中看到的，我也尝试使用initState 设置主页小部件，但我无法将 initState 设为异步函数。我觉得在 Flutter 中选择主页有更好的方法。我错过了什么？

请注意AuthUser.getCurrentUser() 必须是异步函数，因为我使用SharedPreferences 库来获取存储在内存中的登录令牌。

Answer 1

您可以使用 FutureBuilder，它允许您在未来构建一个小部件。 举个例子：

class OnBoardingWidget extends StatefulWidget {
  const OnBoardingWidget({Key key}) : super(key: key);

  @override
  State<OnBoardingWidget> createState() => _OnBoardingWidgetState();
}


class _OnBoardingWidgetState extends State<OnBoardingWidget> {
  final Future<String> _waiter = Future<String>.delayed(
    const Duration(seconds: 2), () => 'Data Loaded',
  );

  @override
  Widget build(BuildContext context) {
    return Container(
      child: FutureBuilder<String>(
        future: _waiter,
        builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
          Widget wdgt;
          if (snapshot.hasData) {
            wdgt = Text('Result: ${snapshot.data}');
          } else if (snapshot.hasError) {
            wdgt = Text('Ops ops ops');
          } else {
            wdgt = Text('Not ready yet');
          }
          return Center(child: wdgt);
        },
      ),
    );
  }
}