如何在React Native中從Firebase Auth調度Redux操作

Question

我正在嘗試根據文檔使用firebase auth偵聽器調度logIn函數。 但是我想使用偵聽器觸發redux動作來填充我的狀態。

當我嘗試運行以下代碼時，使用Firebase成功登錄后，它將失敗，並顯示“無法讀取未定義的屬性'logIn'。

請暫停

 class RootApp extends Component { componentWillMount() { // Listen for Auth Changes firebase.auth().onAuthStateChanged(function(user) { if (user) { this.props.logIn( uid, displayName, photoURL, providerId, email, emailVerified ); // User is signed in. } else { console.log("Not logged in"); // No user is signed in. } }); } render() { if (this.props.auth.checking == true) { return ( <ActivityIndicator animating={true} style={styles.activityIndicator} size="large" /> ); } else if (this.props.auth.signedIn == true) { return <SignedIn />; } else { return <SignedOut />; } } } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", alignItems: "center", justifyContent: "center", fontSize: 96 }, activityIndicator: { flex: 1, justifyContent: "center", alignItems: "center", height: 80 } }); const mapStateToProps = state => { return { auth: state.auth }; }; const mapDispatchToProps = dispatch => { return { logIn: ( uid, displayName, photoURL, providerId, email, emailVerified ) => { dispatch( logIn( uid, displayName, photoURL, providerId, email, emailVerified ) ); } }; }; export default connect(mapStateToProps, mapDispatchToProps)(RootApp); 

Answer 1

對於其他遇到這種情況的人，答案是將Firebase示例偵聽器功能轉換為粗箭頭功能，因為在其示例中使用的老式函數將其自身綁定為“ this”，而箭頭功能則不這樣做。

所以這：

firebase.auth（）。onAuthStateChanged（function（user）{

需要更改為：

firebase.auth（）。onAuthStateChanged（user => {