從 Axios 返回 Promise？

Question

我想知道如何從 Axios 返回承諾？ 我不確定是否需要使用攔截器？

我現在有這個代碼

export function fetchStorage() {
    return function (dispatch) {
      return new Promise(function(resolve, reject) {
        if (1 === 1) {
          resolve('it works!');
        } else {
          reject(':(');
        }
      });
    };
}

和

this.props.fetchStorage().then(function() {
           console.log('then');
        });

現在說我想更改 fetchStorage 以通過 ajax 做一些事情，我希望它像

 var instance = axios.create({
            baseURL: 'http://localhost:54690/api',
            timeout: 2000,

        });

        instance.get('/Storage/Get')
            .then(function (response) {
                console.log(response);
            })
            .catch(function (error) {
                console.log(error);
            });

我如何返回承諾而不是在這里做？

編輯

只是為了澄清為什么我這樣做我有這樣的事情

  componentWillMount() {
        this.props.setPreLoader(true);
        this.props.fetchStorage().then(function() {
           this.props.setPreLoader(false);
        });
    }

export function fetchStorage() {
    return function (dispatch) {
        return new Promise(function (resolve, reject) {
            axiosInstant.get('/Storage/Get')
                .then(function (response) {
                    let payload = response.data;
                    console.log(payload);
                    dispatch({ type: actions.FETCH_STORAGE, payload: { storages: payload } });
                })
                .catch(function (error) {
                    console.log(error);
                });
        });
    };
}

Answer 1

axios 是基於promise 的，所以你不需要把它包裝在Promise 中，你可以這樣做，還有axiosInstance.[post|put|get| 結束等]方法將返回承諾。

export function fetchStorage() {
    return function (dispatch) {
       return axiosInstant.get('/Storage/Get')
                .then(function (response) {
                    let payload = response.data;
                    console.log(payload);
                    dispatch({ type: actions.FETCH_STORAGE, payload: { storages: payload } });
                })
                .catch(function (error) {
                    console.log(error);
                });
    };
}

Answer 2

一定有更好的方法，但你可以

export async function fetchStorage() {
    return async function (dispatch) {
        try {
            const { data } = await axiosInstant.get('/Storage/Get')
            dispatch({ type: actions.FETCH_STORAGE, payload: { storages: data } })
            return data
        } catch (e) {
            console.error(e)
        }
    }
}

然后你必須使用 fetchStorage 如下

this.props.fetchStorage().then(async function(response) {
    let payload = await response()
});

Answer 3

見示例：

 return new Promise(function (resolve, reject) {
    var instance = axios.create({
        baseURL: 'http://localhost:54690/api',
        timeout: 2000,
    });
    instance.get('/Storage/Get')
        .then(function (response) {
            if(1 === 1)
            resolve(response);
        })
        .catch(function (error) {
            reject(error);
        });

 });