Как я могу инициировать новую функцию, сразу после того, как функция успешна в реакции нативной

Question

Я хочу запустить функцию сразу после ее завершения, а также передать некоторые данные во вторую функцию. Я протестировал две функции по отдельности, они обе работают. Но я хочу инициировать второй сразу после завершения первого

Это мой код ниже, но вторая функция не работает должным образом.

const ChargeCard = (dispatch) => ({
    cardNumber,
    expiryMonth,
    expiryYear,
    cvc,
    email,
    amountInKobo,
    id
}) => {

    try {
        RNPaystack.chargeCard({
            cardNumber: cardNumber,
            expiryMonth: expiryMonth,
            expiryYear: expiryYear,
            cvc: cvc,
            email: email,
            amountInKobo: amountInKobo * 100

        })
            .then(response => {

                if (response) {
                    setBasic({ id }) //the function to run if this is successful
                }                
            })

    } catch {

        dispatch({
            type: "ADD_ERROR",
            payload:
                "Something went wrong during payment, please try again, don't worry you have not been charged."
        });    
    }

};

Эта функция, которую я хочу запустить немедленно, что успешно;

const setBasic = () => async ({ id }) => {
    const Basic = 1
    const response = await appApi.put(`/usersub/${id}`, { Basic });
    if (response) {
        console.log(response.data)
    }
}

Answer 1

зачем смешивать async await с then() придерживаться одного и быть в соответствии с ним.

const setBasic = async ({ id }) => {
    const Basic = 1
    const response = await appApi.put(`/usersub/${id}`, { Basic });
    if (response) {
        console.log(response.data)
    }
}

const ChargeCard = (dispatch) => async ({
    cardNumber,
    expiryMonth,
    expiryYear,
    cvc,
    email,
    amountInKobo,
    id
}) => {

    try {
        const response = await RNPaystack.chargeCard({
            cardNumber: cardNumber,
            expiryMonth: expiryMonth,
            expiryYear: expiryYear,
            cvc: cvc,
            email: email,
            amountInKobo: amountInKobo * 100

        })
        if(response) setBasic({ id }) //the function to run if this is successful

    } catch {

        dispatch({
            type: "ADD_ERROR",
            payload:
                "Something went wrong during payment, please try again, don't worry you have not been charged."
        });    
    }

};

Таким образом, ваш логин последовательный. Тем не менее, я просто хочу упомянуть об этом; Ваша первая функция выглядит как сокращенный способ написания action creators using redux-thunk, если я прав, я думаю, что вы неправильно передаете dispatch в первой функции. Вы должны переписать свою функцию следующим образом:

const ChargeCard = ({
    cardNumber,
    expiryMonth,
    expiryYear,
    cvc,
    email,
    amountInKobo,
    id
}) => async dispatch => {

    try {
        const response = await RNPaystack.chargeCard({
            cardNumber: cardNumber,
            expiryMonth: expiryMonth,
            expiryYear: expiryYear,
            cvc: cvc,
            email: email,
            amountInKobo: amountInKobo * 100

        })
        if(response) setBasic({ id }) //the function to run if this is successful

    } catch {

        dispatch({
            type: "ADD_ERROR",
            payload:
                "Something went wrong during payment, please try again, don't worry you have not been charged."
        });    
    }

};

Answer 2

Измените вторую функцию следующим образом:

const setBasic = async ({ id }) => {
    const Basic = 1
    const response = await appApi.put(`/usersub/${id}`, { Basic });
    if (response) {
        console.log(response.data)
    }
}

Вы определили ее как:

const setBasic = () => async ({ id }) => {

, но вызываете ее с помощью:

 setBasic({ id })