reactjs - ログイン ajax リクエスト Flux React?

Question

応答を提供する フラックス構造 ajax リクエストを使用して
、ログインフォーム送信 (React コンポーネント) 後にどうすればよいですか? 例を挙げていただけますか？

Answer 1

基本的に、Ajax リクエストを作成してから、成功/エラー ハンドラーを作成する必要があります。これらのハンドラー内で、ストアに結果を通知するアクションを作成します。現在のユーザーと認証トークンに関連するデータを保持する AppStore や SessionStore などを用意することをお勧めします。現在のユーザーが認証されると、コントローラービューはそのストアをリッスンし、子をレンダリングできます。

Answer 2

これが私が作った方法です：

コンポーネントがブートストラップするとき、最初に必要なデータを取得する Store に対して INIT アクションを起動します。簡略化されたデータ フローは次のとおりです。

ログイン後、ライブラリ コンポーネントがレンダリングされるため、データ (書籍、ユーザーなど) を初期化する必要があります。

としょうかん：

componentDidMount: function() {
  Store.addChangeListener(this._onChange);
  Actions.initialize();
},

ご覧のとおり、コンポーネントがマウントされたときに新しいアクションを起動すると、ストアがこのアクションを処理します。

店：

switch(action.actionType) {

    case Constants.INIT:
      _init().done(function() {
        Store.emitChange();
      });
      break;

_init()promise オブジェクトを返すプライベート関数を呼び出しています。promise が満たされると、Store はその change イベントを発行する準備が整います。

_init私はいくつかの非同期データロードをシミュレートしています。それが私が約束した理由です。ここにあります:

function _init() {

  var loadBooksDeferred = new jQuery.Deferred(),
      loadUsersDeferred = new jQuery.Deferred(),
      loadCategoriesDeferred = new jQuery.Deferred(),
      stateReadyDfd = new jQuery.Deferred();

  _loadBooks(loadBooksDeferred);
  _loadUsers(loadUsersDeferred);
  _loadCategories(loadCategoriesDeferred);

  jQuery
    .when(loadBooksDeferred, loadUsersDeferred, loadCategoriesDeferred)
    .then(stateReadyDfd.resolve, stateReadyDfd.reject);

  return stateReadyDfd;
}