2

私は ReactJS で Facebook Flux (Fluxxor を使用していますが、それほど重要ではないと思います) をいじっていますが、これまでのところ、アプリケーション内のデータ フローを操作する優れた方法だと思います。ただし、頭を悩ませていることが 1 つあります。これは単に Flex で行うべきではないことであるか、明らかな何かが欠けている可能性がありますが、なぜ私が質問しているのか...

たとえば、ログインするためのシステムを構築しています。非常に簡単です。ログイン ダイアログがポップアップ表示され、ユーザー名とパスワードを入力してボタンを押します。これは、LoginAction.login(username, password) Action Creator を呼び出します。これは、LOGIN イベントを Dispatcher に送信し、API 呼び出しをトリガーしてユーザーを認証し、資格情報が正しいことを確認します。API から成功が返された場合は、LOGIN_SUCCESS イベントを Dispatcher にトリガーします。SessionStore がこれを処理し、ログインに成功したという事実と、ユーザーの詳細を保存します。これにより、UI の一部が更新されます。たとえば、「ログイン」ボタンが「Hello Graham」というテキストに変わり、代わりに「ログアウト」ボタンが表示されます。それはすべて本当に簡単で、うまく機能し、理にかなっています。

私が立ち往生しているのは、ログインが失敗したときです。無効なユーザー名/パスワードを入力した場合、ログインダイアログでユーザーにこれを伝えて、入力した内容を修正して再試行できるようにします。これを達成するために私が考えることができる唯一の方法は、LOGIN_FAILED イベントを Dispatcher に送信することです。これは、Dialog が表示する最後のログイン エラーを格納する Store によって処理されます。ただし、これらのエラーはアプリケーションの状態ではなく、失敗したこの 1 つの要求に関する推移的な情報であるため、ユーザーが修正して再試行するため、奇妙に感じます。

この推移的な状態は、ユーザー入力が原因で失敗する可能性のある API 呼び出しの周りで非常に一般的になるので、アプリケーションの状態の一部としてではなく、別の場所に属しているように感じます。ただし、Flux がこの推移的な状態を UI に戻してユーザーに表示する方法を理解できません...

4

1 に答える 1

0

SessionStore はこれを処理し、正常にログインしたという事実を保存します

あなたの場合、成功した認証に関する情報を保持します。失敗した 1 回に関する情報をストア (同じストアまたはユーザーの認証状態または許可状態を保持する独立した 1 回) にも保持しないのはなぜですか?

それはあなたの州の別の側面です。この場合、失敗時に特別なイベント(ログインの成功の場合など)をストアにディスパッチし、新しい状態を保存し、UI に変更を送信するだけです。

これは、私が意味するものに似ている例です。ログインに失敗した場合、サーバー ant にリクエストを送信してアクションをディスパッチできます。

于 2015-01-19T11:18:40.303 に答える