Löschen eines Artikels mit Redux-Saga

Question

Ich konnte ein Element nicht mit Redux Saga in meiner Anwendung löschen. Ich könnte es in Redux Thunk tun. Ist der Fluss beim Löschen eines Artikels richtig, wenn redux saga verwendet wird? Was ist falsch in meinem Code oder was habe ich verpasst? Kann mir bitte jemand aufklären?

Hier ist mein Code

saga.js

export function dataLoader(apiUri, onSuccess, onError, data) { 
    return function*() { // eslint-disable-line func-names 
    const requestURL = `${API_BASE}${apiUri}?format=json`; 
    try { 
     // Call our request helper (see 'utils/request') 
     let options; 
     if (data !== undefined) { 
     // If we have data to post 
     options = { 
      method: 'POST', 
      body: JSON.stringify(data), 
      headers: { 
      'Content-Type': 'application/json', 
      'X-CSRFToken': Cookies.get('csrftoken'), 
      'X-Requested-With': 'XMLHttpRequest', 
      }, 
     }; 
     } 
     const response = yield call(request, requestURL, options); 
     yield put(onSuccess(response)); 
    } catch (e) { 
     let error = null; 
     try { 
     error = yield call(() => e.response.json()); 
     } catch (_) { 
     error = { 
      errors: [{ 
      'error code': e.response.status, 
      'error msg': e.response.statusText, 
      }], 
     }; 
     } 
     yield put(onError(error)); 
    } 
    }; 

    function* isDeviceToDeleteValid(device) { 
    const devices = yield select(selectDevices()); 
    if (devices.get(device.get('id'))) { 
     yield put(deleteDeviceSuccess(device.get('id'), device)); 
    } 
    } 

    function* deleteDevice(action) { 
    const device = action.data.toJS(); 
    if (yield call(isDeviceToDeleteValid, fromJS(action.data))) { 
     yield fork(dataLoader(`/device/${device.id}`, deleteDeviceSuccess, deleteDeviceError, action.data)); 
    } 
    } 

    function* rootSaga() { 
    yield takeEvery(DELETE_DEVICE, deleteDevice); 
    } 

actions.js

export function deleteDevice(data) { 
    return { 
     type: DELETE_DEVICE, 
     data, 
    }; 
    } 

    export function deleteDeviceSuccess(deviceId, device) { 
    return { 
     type: DELETE_DEVICE_SUCCESS, 
     deviceId, 
     device, 
    }; 
    } 

    export function deleteDeviceError(error) { 
    return { 
     type: DELETE_DEVICE_ERROR, 
     error, 
    }; 
    } 

reducers.js

case CREATE_DEVICE: 
    case UPDATE_DEVICE: 
    case DELETE_DEVICE: 
    return state 
     .set('loading', true) 
     .set('error', null); 
    case CREATE_DEVICE_ERROR: 
    case UPDATE_DEVICE_ERROR: 
    case DELETE_DEVICE_ERROR: 
    return state 
     .set('loading', false) 
     .set('error', action.error); 
    case CREATE_DEVICE_SUCCESS: 
    case UPDATE_DEVICE_SUCCESS: { 
    const device = fromJS(action.device.data, idReviver); 
    return state 
     .set('loading', false) 
     .set('error', null) 
     .setIn(['devices', device.get('id')], device); 
    } 
    case DELETE_DEVICE_SUCCESS: { 
    const device = fromJS(action.device, idReviver); 
    return state 
     .set('loading', false) 
     .set('error', null) 
     .filter(() => device.get('id') !== action.deviceId); 
    } 

Answer 1

Einige Probleme sehe ich mit den Kommentaren zu den Zeilen.

function* isDeviceToDeleteValid(device) { 
    // select takes a function, unless selectDevices() was returning a function 
    const devices = yield select(selectDevices()); 
    // shouldn't you be returning a boolean?? 
    if (devices.get(device.get('id'))) { 
    yield put(deleteDeviceSuccess(device.get('id'), device)); 
    } 
} 

scheint Below korrektere

function* isDeviceToDeleteValid(device) { 
    const devices = yield select(selectDevices); 
    return !!devices.get(device.get('id')); 
} 

Ich sehe keine Probleme mit dem Rest.