呼叫異步相互依存的終極版動作一個接一個

後，在我的反應的組分之一，我有以下方法：呼叫異步相互依存的終極版動作一個接一個

save() { 
    var arrLength = this.state.arr.length; 
    if(arrLength > 1) { 

     var start = this.state.arr[arrLength-2]; 
     var end = this.state.arr[arrLength-1]; 


     this.props.updateItemAudio(start,end); 
     this.props.saveItemToDisk(); 
     this.props.getNextItem(); 
    } 
    else { 
     console.log("Array not long enough yet"); 
    } 
    }

最重要的一點是：

this.props.updateItemAudio(start,end); 
    this.props.saveItemToDisk(); 
    this.props.getNextItem();

我需要等待第一個函數在執行第二個函數之前調用它，第三個函數與第三個函數相同。我怎樣才能做到這一點？我聽說有這個新的async/await syntax，我可以在這裏以某種方式使用它嗎？我不希望將回調函數傳遞給這些操作中的每一個。

編輯：我的方法不回覆承諾，他們是正常的Redux行動。

來源

2017-10-05 George Welder

難道這三個函數返回的承諾？ –

不，但你提到它很好，我編輯了我的問題。這三個功能只是「正常」的還原操作。 –

或者您可以在這些個人動作創建者中執行它們，即在完成運行saveItemToDisk並且一旦完成運行後，即在updateItemAudio動作中執行它們。getNextItem – linasmnew

你可以後的第一個動作的另一個內執行它們一個，即：

updateItemAudio = async (start, end) => { 

    return (dispatch) => { 

    try { 

     // updateItemAudio stuff... 
     let resultTwo = await saveItemToDisk(); 
     let resultThree = await getNextItem(); 

     // now all 3 executed in order 

    } catch (err) { 
     console.log(err); 
    } 

}

來源

2017-10-05 15:34:55 linasmnew

如果你的方法返回保證你可以使用：

async save() { 
await this.props.firstMethod(); 
await this.props.secondMethod(); 
await this.props.thisMethod(); 
}

文檔：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function

你捆綁商或其他任務運行人員應該傳送EcmaScript7請記住

來源

2017-10-05 15:36:40 Ortee

它不返回承諾，它是普通的redux動作。 –

然後你可以在redux動作中使用這個語法： 'myReduxAction（）{ return（dispatch）=> { return new Promise（（resolve，reject）=> { resolve（）;響應或您的行動結束 }） } }' 更好的語法https://pastebin.com/7xkJieb4 – Ortee

純粹的redux不允許您以乾淨的方式在另一個動作之後分派動作。

我會建議使用第三方庫，例如redux-observable或redux-saga。它們非常適合您的使用情況。

可以解決以這種方式使用redux-observable這個問題：

const myEpic = combineEpics(
    // listening to UPDATE_ITEM_AUDIO action type and dispatching saveItemToDisk() action after it 
    action$ => action$.ofType(UPDATE_ITEM_AUDIO).map((action) => saveItemToDisk()), 
    // the same as above, but listening for SAVE_ITEM_TO_DISK, and dispatching getNextItem() action 
    action$ => action$.ofType(SAVE_ITEM_TO_DISK).map((action) => getNextItem()) 
)

來源

2017-10-05 18:55:38 1ven

呼叫異步相互依存的終極版動作一個接一個

回答

相關問題