Flutter-当用户登录Firebase时,FutureBuilder没有重建



我正在尝试使用main.dart文件中的FutureBuilder获取currentUser

//my auth.dart file
class Auth {
final FirebaseAuth _auth = FirebaseAuth.instance;
Future getUser() {
return _auth.currentUser();
}
}

class MyApp extends StatelessWidget {
Auth auth = Auth();
@override
Widget build(BuildContext context) {
return MaterialApp(
home: FutureBuilder(
future: auth.getUser(),
builder: (context, AsyncSnapshot snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
if (snapshot.error != null) {
print("$snapshot.error.toString()");
return Container();
}
if (snapshot.hasData) {
return BottomBar(
firebaseUser: snapshot.data, visibleLogin: false);
} else if (snapshot.data == null) {
return BottomBar(
firebaseUser: null,
visibleLogin: true,
);
}
}
return CircularProgressIndicator();
}),
);
}
}

//更新,尝试使用StreamBuilder

StreamBuilder<FirebaseUser>(
stream: FirebaseAuth.instance.onAuthStateChanged,
builder: (BuildContext context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
if (snapshot.data.uid!=null) {
return BottomBar(
firebaseUser: snapshot.data, visibleLogin: false);
} else {
return BottomBar(
firebaseUser: null,
visibleLogin: true,
);
}
}
return CircularProgressIndicator();
}),

每当我的用户登录时,我都会在底部导航栏中传递用户,然后导航栏会将数据传递到我的所有页面。我的登录名和我的主页在同一个页面上,所以每当我的用户登录时,我都想在主页中隐藏登录部分。

Widget login(bool visibleLogin) {
return Visibility(
visible: visibleLogin,
child: Align(
alignment: Alignment.bottomCenter,
child: Padding(
padding: const EdgeInsets.only(bottom: 78.0),
child: Container(
height: 90,
color: Colors.transparent,
margin: EdgeInsets.fromLTRB(8.0, 0.0, 8.0, 0.0),
child: Container(
child: Container(
margin: EdgeInsets.only(top: 20.0),
child: Column(
children: [
Padding(
padding: EdgeInsets.only(top: 5.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
GestureDetector(
onTap: () => auth.signInWithGoogle(),
child: Container(
padding: EdgeInsets.all(10.0),
child: Icon(
FontAwesome.google,
color: kOrange,
),
),
),
],
),
),
],
),
),
),
),
),
),
);
}

当我的用户登录时,我的FutureBuilder不会自动更新我的应用程序的UI,因此我在主页的initState((中调用onAuthStateChanged监听器:

void isSignedIn() {
_auth.onAuthStateChanged.listen((user) {
if (user != null) {
setState(() {});
} else {
print('no user');
}
});
}
}

检查后,此方法被触发,但我的UI只有在关闭并重新启动应用程序时才会更新。如何在用户登录后立即更新用户界面?

我认为FutureBuilder不可能做到这一点,您必须使用StreamBuilder才能实现此功能。

一旦Future完成,它就不会寻求任何更改,就像您使用流一样,每当新数据到达时,它都会更改数据。

更新:

您甚至不需要更改任何变量或调用任何方法,现在只需检查快照并相应地显示屏幕即可。确保检查连接状态已完成,因为在此之前,即使用户登录,它也会返回null。

StreamBuilder(
stream: FirebaseAuth.instance.onAuthStateChanged,
builder: (_, snap) {
if(snap.connectionState == ConnectionState.active){
if(snap.data == null){
// return with out login
}else{
// return  login
}
}else{
return CircularProgressIndicator();
}
},
),

更新:

Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
StreamBuilder(
stream: FirebaseAuth.instance.onAuthStateChanged,
builder: (_, snap) {
print(snap.connectionState);
if (snap.connectionState == ConnectionState.active) {
print(snap.data.toString());
if (snap.data == null) {
return Text("not login");
} else {
return Text("login");
}
} else {
return CircularProgressIndicator();
}
},
),
RaisedButton(
child: Text("hello"),
onPressed: () {
var a = FirebaseAuth.instance.signInAnonymously();
print(a);
},
),
RaisedButton(
child: Text("Log out"),
onPressed: () {
var a = FirebaseAuth.instance.signOut();
print(a);
},
)
],
),

最新更新