2016-12-23 7 views
3

私はReactを初めて使用しています。ノードサーバーへのPOSTに反応してJSON応答を処理する

ノードサーバーからステータス200を取得した後に別のコンポーネントのレンダリングを行うコンポーネントを変更する方法はありますか?

たとえば、エクスプレスサーバーで私のノードにサインアップページからPOST HTTPリクエストを行っています。私のフロントエンドへのjsonオブジェクトによるサーバーの応答。これで、サインアップページではなく、プロファイルコンポーネント/ページをレンダリングします。これにより、Jsonデータを使用してプロファイルページでレンダリングすることができます。これは可能ですか?あなたが別の選択肢を持っているなら、私は提案についても開いています。

ありがとうございました。

注:私は異なるルートを制御するために反応ルータを使用しています。 私のノードサーバーは、シングルを処理するためにパスポートを使用してセットアップされています。

答えて

0

あなたは基本的に(アプリケーションの状態を管理する必要があります。

ログインが成功した場合は、user_is_loggedをtrueに設定したとします。以下のようにすることができます:

AJAXコールバックで
var PageWrapper = React.createClass({ 
    render : function() { 
     // user_is_logged is true if user is correctly logged 
     // LoginPage is the authentication form 
     var pageContent = user_is_logged ? this.props.children : <LoginPage />; 
     return (
      <div> 
       <Menu /> 
       <div className="container"> 
        {pageContent} 
       </div> 
      </div> 
     ); 
    }, 
}); 

var MyPage = React.createClass({ 
    render : function() { 
     return (
      <PageWrapper> 
       <div>content of page...</div> 
      </PageWrapper> 
     ); 
    }, 
}); 

そして再レンダリングページ:

ReactDOM.render (<MyPage />, document.getElementById('my-app')); 

ルータに反応してまた働きます。

0

は、問題あなたにそれが明確になり、その概念を理解http://redux.js.org/

で利用可能Reduxのアーキテクチャを見てみてください。その後

、再来の高度なトピックに移動し、あなたがリクエストがReduxのコンポーネントとの対話方法非同期理解するだろう - http://redux.js.org/docs/advanced/

は、この情報がお役に立てば幸いです(

関連する問題