Как добавить функцию обратного вызова в вызове действия

Question

Я совершенно новичок в react-redux. здесь я использую thunk. Сейчас, У меня есть следующий сценарий, где

this.props.removeTech({ newArr, removeType });

Я вызываю это действие из моего компонента,

export function removeTech(data) {
    return (dispatch) => {
        dispatch({
            type: REMOVE_TECH,
            data: data,
        });
    }
}

и обновляет состояние,

Но

Я делаю,

this.props.removeTech({ newArr, removeType });
    let validateData = this.validate(removeType, noc);
    console.log("removing data",validateData);
    this.setState({
      showError: validateData
    })

Таким образом, validateData нужны некоторые данные, которые должны быть обновлены, но он получает предыдущие данные, и из-за этого не возвращает правильное значение. Итак,

Я хочу вызвать эту функцию после обновления состояния. Итак, кто-нибудь может мне помочь с этим?

Answer 1

Вы можете вернуть обещание для вашего действия removeTech, а затем вы можете использовать метод then() для this.props.removeTech.

Примерно так:

export function removeTech(data) {
    return (dispatch) => {
        dispatch({
            type: REMOVE_TECH,
            data: data,
        });
        return Promise.resolve();
    }
}

А потом

this.props.removeTech({ newArr, removeType }).then(() => {
    let validateData = this.validate(removeType, noc);
    console.log("removing data",validateData);
    this.setState({
      showError: validateData
    })
});

Надеюсь, это поможет:)

Answer 2

Если validate является асинхронной функцией, используйте Promise и вызовите setState в then. Если validate - это другое действие, возможно, это его работа - обновить showError в состоянии.

А для вашей информации вам не нужен thunk для removeTech, вы можете просто сделать:

export const removeTech = data => ({ type: REMOVE_TECH, data, });