flutter：由 future builder 引起的红屏

Question

我的 flutter-firebase 应用从检查用户状态开始。如果用户是专业人士，将显示 mypagepro 屏幕，否则将显示 mypage。这是我的代码。

@override
Widget build(BuildContext context) {
  return FutureBuilder(
      future: FirebaseFirestore.instance
          .collection('crews')
          .doc(user.uid)
          .get(),
      builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
        if (snapshot.data['isPro'] == true) {
          return MyPagePro();
        } else {
          return MyPage();
        }
      });
    }
  }
}

问题是在最终显示 mypage 或 mypagepro 屏幕之前检查用户状态需要很长时间以致出现红色屏幕。

我想显示 mypage 或 mypagepro 屏幕而不显示任何像这样的红色屏幕。如何在检查用户状态时避免出现红屏？

Answer 1

您正在尝试访问尚未收到的数据的属性。尝试使用以下代码。

    @override
Widget build(BuildContext context) {
  return FutureBuilder(
      future: FirebaseFirestore.instance
          .collection('crews')
          .doc(user.uid)
          .get(),
      builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
        if (snapshot.hasData && snapshot.data["isPro"]) {
          return myPagePro();
        } else {
          return MyPage();
        }
      });
    }
  }
}

Answer 2

您应该检查 snapshot 是否有数据。

试试这个：

@override
Widget build(BuildContext context) {
  return FutureBuilder(
      future: FirebaseFirestore.instance
          .collection('crews')
          .doc(user.uid)
          .get(),
      builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
        if (snapshot.hasData && snapshot.data['isPro'] == true) {
          return MyPagePro();
        } else {
          return MyPage();
        }
      });
    }
  }
}

Answer 3

Need Validation Use

snapshot.hasData ? myPagePro() : MyPage()

   @override
    Widget build(BuildContext context) {
      return FutureBuilder(
          future: FirebaseFirestore.instance
              .collection('crews')
              .doc(user.uid)
              .get(),
          builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) =>
            snapshot.hasData ?  myPagePro() : MyPage()
          );
        }
      }
    }

flutter：由 future builder 引起的红屏

flutter: red screen caused by future builder

future

builder

firebase

flutter