2017-10-03 10 views
1

コンポーネントでは、onClickがフェッチバックエンド削除要求を送信するdeleteQuestionアクションをディスパッチし、応答を受け取ったときに別のアクションReduxストアを更新します。onClick deleteディスパッチは、応答を受け取った後に2回目のディスパッチ要求を送信しません。

しかし、それはonClickイベントであるため、deleteQuestion関数はComponentWillMountからの従来のディスパッチ要求のようには機能せず、代わりに呼び出されないディスパッチパラメータを持つ匿名関数を返します。したがって、私はそのようなonClickの方法で同時に二回の発送を呼び出すために必要だ:

handleDelete =() => { 
    const { questionId } = this.props.match.params 
    const { history } = this.props 
    deleteQuestion(questionId, history)(deleteQuestion); //calling method twice 
    } 

私が応答を受信したときに、このアプローチは、Railsのバックエンドに削除要求をトリガリングのために有効であるが、第二の発送をdeleteQuestionアクション(ディスパッチ(removeQuestion(questionId))に埋め込まれている関数は、Reduxストアの更新をトリガーしません。私はストア内に複数のデバッガを配置し、コンソールとターミナルでエラーをチェックしようとしましたが、何も起こりません。

私はReduxのドキュメントやその他のリソースをオンラインで読んできましたが、私が見つけたところでは、.thenリクエストで2回目のディスパッチコールを含めることができるはずです。 get、post、およびpatchリクエストでこれを行うことは可能ですが、なぜ削除要求で機能しないのかわかりません。

export function deleteQuestion(questionId, routerHistory) { 
    return (dispatch) => { 
    fetch(`${API_URL}/questions/${questionId}`, { 
     method: 'DELETE', 
    }).then(res => { 
     dispatch(removeQuestion(questionId)) 
    }) 
    } 
} 

そして、githubのは、次のとおりです:

私が作るサンクコールがあり、私は二日のためにこれを渡されますしようとしてきたように私は本当に、任意の洞察力をいただければと思います https://github.com/jwolfe890/react_project1/blob/master/stumped-app-client/src/actions/questions.js

今すぐ!

+0

と同等です。このコンポーネントの 'mapDispatchToProps'はどうなっていますか? – topher

+0

私はアクションをインポートし、それをconnect関数に含めます: – Dog

+0

export default connect(mapStateToProps、{deleteQuestion})(questionCard); – Dog

答えて

1

あなたの店があなたのために質問の削除アクションをディスパッチさせる代わりに、deleteQuestionというアクションを直接呼び出しています。代わりに、既に派遣にマップされているあなたの小道具からdeleteQuestionを呼び出す必要があります:あなたはmapDispatchToPropsとしてオブジェクトを渡す場合、各要素は、ディスパッチコールは

handleDelete =() => { 
    const { questionId } = this.props.match.params 
    const { history } = this.props 
    this.props.deleteQuestion(questionId, history); 
} 

です。つまり、mapDispatchToPropsは、

(dispatch) => ({ 
    deleteQuestion: (...params) => dispatch(deleteQuestion(...params)) 
}) 
+0

ああ。本当にありがとう。私は、このコンポーネントでずっと手を加えてしまいましたが、this.propsを追加するのを忘れてしまいました! – Dog

+0

どういうわけか、昨日はレールバックエンドにぶつかっていなかったのですが、どういうわけか、ここでそれは魔法のように動作しています。再度、感謝します! – Dog

関連する問題