Многократное / массовое удаление в реаги + редукс - PullRequest
Новая
       5

Многократное / массовое удаление в реаги + редукс

0 голосов
/ 25 сентября 2018

У меня есть сетка данных, которая позволяет несколько вариантов выбора и удаления.У меня есть конечная точка удаления из моего API;

DELETE http://localhost:8888/api/audit/id

И это создатель действия; 

export function deleteAudit(audits, callback) {
    let count = 0;
    console.log("selected audits", audits);

    const deleteItem = (auditId) => {
        console.log("deleting..", auditId);

        const endpoint = `http://localhost:8888/api/audit/${auditId}`;
        const req = Axios.delete(endpoint, callback);
        return (dispatch) => {
            req.then(res => {
                if (res.status == HttpStatus.OK) {
                    console.log("deleted", auditId);
                    count += 1;
                    if (audits[count] != null) {
                        deleteItem(audits[count]);
                    }
                    else {
                        console.log("all deleted heading to callback");
                        callback();
                    }
                }
            });
            dispatch({type:DELETE_AUDIT, payload: audits});
        }
    }
    deleteItem(audits[count]);
}

Поскольку моя конечная точка позволяет удалять только один элемент ввремя я использовал рекурсивную функцию для последовательных вызовов.Однако, это не работает должным образом, когда игнорируется использование асинхронного (thunk) подхода, это не обновление списка с новым состоянием.После добавления метода отправки thunk он удаляет только первый выбор, поэтому я полностью теряюсь.Как правильно достичь этого?

1 Ответ

0 голосов
/ 25 сентября 2018

Проблема была в том, что я не импортировал пакет redux-thunk, после его импорта, так как @Tho Vu указал на axios, я изменил свой код следующим образом: 

export const deleteAudit = (audits, callback) => {

    const request = axios.all(_.map(audits, (audit) => 
    {   
        deleteItem(audit);
    }));
    return (dispatch) => {
        request.then(axios.spread((a, f) => {
            dispatch({type:DELETE_AUDIT, payload:audits});
        })).then(() => {
            callback();
        });
    }
}
function deleteItem(id) {
    const endpoint = `http://localhost:8888/api/audit/${id}`;
    return axios.delete(endpoint);
}
...