redux-sagasコールバック（別名：sagasとsetState）

Question

ユーザーがフォームを送信するときにフォームロード状態（スピナーアイコン、入力を無効にする）を設定し、アクションが完了または失敗したときにその状態をクリアします。それは単にそれを理由により難しいthis.setState

を呼び出すよりも多くの仕事だ

1. ：現在、私はいくつかの理由のために迷惑である、アクションの作成者と減速を作成する必要がこれ、私の店でこの状態を格納していますおよそ
2. 私は本当に私の店で地元のコンポーネントの状態を保存したくない

は基本的に私は自分のフォームコンポーネント内でこれをしたい：

handleFormSubmitted() { 
    this.setState({ isSaving: true }) 
    this.props.dispatchSaveForm({ formData: this.props.formData }) 
    .finally(() => this.setState({ isSaving: false })) 
} 

Answer 1

あなたはそれをredux-sagaで行うことはできません。あなたがそこでやろうとしていることは、レフレックス・サガの基本原則に反しています。だから他のサガ（takeを使用して、通常は「ウォッチャー」）

redux-sagaは...あなたのアプリで何が起こっているかを説明するイベントなどのアクションを処理することにより反応性であることを目指していたり​​rootReducerは、それらのアクション/イベントをサブスクライブし、どのような彼らを行うことができます実行する必要があります...そのための

redux-saga -unlike redux-thunkとredux-promiseこと - あなたは、あなたが派遣派遣、および減速時にReduxのサガで、だから... ... dispatchメソッドの動作を変更しない とサガはディスパッチされたアクションにサブスクライブされます。しかし、dispatchメソッドは、他のミドルウェア/ストアエンハンサーを使用するときに起こるような約束を返すことはありません。

redux-sagaは、フォームのリクエストが完了したことをアプリの残りの部分に知らせる唯一の方法は、そのリクエストが終了するかエラーが発生するたびに（put効果を使用して）アクションをディスパッチすることです。したがって、特定のアクションがディスパッチされた場合、どのようにコンポーネントの内部から直接知ることができますか？

コンポーネントを使用して独自のミドルウェアを作成する（または別のコンポーネントを使用する）場合を除き、コンポーネント内の具体的なアクションにサブスクライブする方法はありません。

あなたはreduxストアを保留にするために直接コンテキストにアクセスでき、the redux subscribe methodを直接使用できますが、リスナー機能はディスパッチされたアクションを教えてくれません。アクション（任意のアクション）がディスパッチされたときに呼び出されます...州の一部のプロパティが変更されているかどうかを確認できますが、それは気違いです。それで、あなたが狂っているそのルートを下りたいと思わない限り、あなたはそれをredux-sagaを使って行うことはできません。

（IMHOはあまり良い考えではありませんが）何かをしたいのなら、あなたはredux-sagaを使わないとやらなければなりません。

handleFormSubmitted() { 
    this.setState({ isSaving: true }) 
    yourFetchCall({ formData: this.props.formData }) 
    .then(payload => this.props.dispatchFormSaved(payload)) 
    .catch(error => this.props.dispatchSavingFormErrored(error)) 
    .finally(() => this.setState({ isSaving: false })) 
}