如何用async/await重構這個函數？

Question

我很新的異步/等待，並想知道，什麼是最好的方式來重構下面的代碼與異步/等待？

export const createUser = (values, history) => { 
    return dispatch => { 
    axios.post('/api/signup', values) 
     .then(res => { 
     console.log('result', res); 
     }, rej => { 
     console.log('rejection', rej); 
     }); 
    } 
} 

當只有一個參數提供給.then它是非常簡單的給我，但如果你有兩個參數喜歡這裏，而不是會發生什麼？

Answer 1

這裏是如何做到這一點，利用https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function作爲參考：

const f = (values, history) => { 
    return async function createUser(dispatch) { 
     try { 
      const res = await axios.post('/api/signup', values); 
      console.log('result', res); 
     } catch(e) { 
      console.log('reject', e); 
     }   
    }; 
} 

Answer 2

.then的兩個參數只是成功和錯誤回調。你也可以這樣寫：.then(res => {}).catch(rej => {})

基本上你可以把await的結果看作.then的回調函數。任何時候您在等待承諾的結果，無論您是否使用它，請使用await.對於任何錯誤，請使用通常的try/catch。

return async() => { 
    try { 
    const res = await axios.post('/api/signup', values); 
    console.log('result', res); 
    } 
    catch (rej) { 
    console.log('rejection', rej); 
    } 
} 

有一點要記住的是，async功能總是返回一個Promise，所以調用的代碼已被寫入考慮到這一點。

我寫了一篇關於async/await的博客文章（免責聲明，是我寫了這個）。 1