2016-07-22 4 views
0

私はこの質問を書く方法がわからないので、詳細が必要な場合はお知らせください。Firebase React。 React/WebpackのAuth値にはどのようにしてアクセスできますか?

私はオンラインショップのWebアプリケーションを構築しています。私は、GoogleのFirebase認証APIを使用してログイン機能をコーディングしています。

それは罰金や内部に記録します。その後、機能user.getTokenは()、私はちょうど罰金のdisplayNameをCONSOLE.LOGすることができます。それが静的なWebページだった場合は、DOMにも追加できます。

はインサイドかかわら/ WebPACKのが反応し、私は私のusernameState状態としてのdisplayName文字列を設定します。それは私がthis.setStateをのuser.getToken()。そしての関数の中で実行すると動作しません。エラーを起こします。以下を参照してください。

ウェブページ/反応状態でこの値を使用したいと考えています。 this.state = {usernameState: ""}

constructor(){ 
    super(); 
    this.state = { 
     usernameState: "" 
    }; 

    firebase.auth().onAuthStateChanged(function(user) { 
     if (user) { 
     // User is signed in. 
     var displayName = user.displayName; 
     var email = user.email; 
     var emailVerified = user.emailVerified; 
     var photoURL = user.photoURL; 
     var uid = user.uid; 
     var providerData = user.providerData; 

     user.getToken().then(function(accessToken) { 

      console.log(displayName); 

      this.setState({ 
      usernameState:JSON.stringify(displayName) //cannot read property 'setState' of undefined 
      }); 
     }); 
     } else { 
     // User is signed out. 
     console.log("signed out"); 
     } 
    }, function(error) { 
     console.log(error); 
    }); 



    }; 
+0

を保存し、私は単に=この下のconstの自己を置きます。 @ Yiang YDに感謝 –

答えて

1

バインドを行うか、この問題accross来て、誰のために本当のthis

constructor(){ 
    super(); 
    this.state = { 
     usernameState: "" 
    }; 
    const self=this; 
    ... 
    self.setState(...) 
    ... 
} 
+0

信じられないほど、それは働いた。どうもありがとうございます。なぜこれが機能し、どのようにバインドするのか説明するのに困っていますか? –

+0

'this'はJSの重要なポイントの1つですが、長い間JSを使いたいのであれば、PLZはいくつか学んでいます。 –

関連する問題