redux thunkが2つの異なるapiリクエストを呼び出す

Question

アクションで2つのapiを呼び出そうとしています。 1つが完了したら、もう1つは最後のものを減速機に渡します。 私のgetAttendingは投稿と同時に呼び出されているように見えますが、投稿が完了した後ではありません。私はredux-thunkには新しく、完成したものを次々と呼び出すことができると思った。

export function postDeclined(id){ 
     let post = axios.post(blaBla.com); 
     let getAttending = axios.get(attending.com); 
     return (dispatch) => { 
      post.then(()=>{ 
       getAttending.then(({data})=>{ 
        dispatch({ 
         type: type.NOT_GOING, 
         payload: data.data 
        }); 
       }); 
      }); 
     } 
    } 

Answer 1

このようなAPI呼び出しをやってみてください。

export function postDeclined(id){ 
     return (dispatch) => { 
      axios.post(blaBla.com).then(()=>{ 
       axios.get(attending.com).then(({data})=>{ 
        dispatch({ 
         type: type.NOT_GOING, 
         payload: data.data 
        }); 
       }); 
      }); 
     } 
    } 

あなたは

Answer 2

...呼び出しは、あなたが実際にAPIを呼び出した...そう、それは非同期をしていた「と宣言」する場合

あなたのバーベル設定にasync/awaitを追加します。これらのものの読み込み/デバッグをもっと簡単にします。

Answer 3

コードサンプルによくある問題があります。この関数はすぐに2つのことを行います：apisの呼び出しを行い、アクションをディスパッチします。また、あなたがチェーンの約束は、あなたがその中間のコールバックは必要ありませんことを、予めご了承ください。

export const postDeclined = id => 
    axios.post(blaBla.com).then(axios.get(attending.com)); 

export const notifyNotGoing = dispatch => promisedResult => 
    promisedResult.then(({data}) => 
    dispatch({ 
     type: type.NOT_GOING, 
     payload: data.data 
    }) 
    ); 

をそして、あなたはそのようなあなたの関数を呼び出すことができます。

notifyNotGoing(dispatch)(postDeclined(2)) 

または組成物を使用したとカリー化（私は個人的にRamda）

const prog = compose(notifyNotGoing(dispatch), postDeclined) 
prog(2)