Comencé a usar RxJs con redux y creé una secuencia que funciona. Aquí está mi tubo de acción:
action$.pipe( ofType(DELETE_CALL_HISTORY), withLatestFrom(state$), mergeMap(() => fromPromise(accessService.getCallHistory()).pipe( mergeMap((res: any) => of(deleteCallHistory(res))), mergeMap((res: any) => of(setCallHistory(res.param))), catchError((err: any) => { console.error(err); return of( showErrorAndHideAfterDelay({ message: err, label: 'Error', }), ); }), ), ), ), Aquí he estado tratando de usar tres acciones. La acción getCallHistory está obteniendo los datos primero. La acción deleteCallHistory es eliminar un elemento de la lista. La tubería de acción está funcionando hasta aquí. Después de esto, intento configurar la lista actualizada con la acción setCallHistory . Pero esto no está funcionando. Se está llamando a la acción setCallHistory, pero cuando vuelvo a cargar la aplicación, los elementos eliminados están de vuelta. ¿Debo usar mergeMap así dos veces o necesito usar algo más?
Nota a su código:
// ... mergeMap((res: any) => of(deleteCallHistory(res))), // now pipeline contains response of the deleteCallHistory mergeMap((res: any) => of(setCallHistory(res.param))), //... ¿No te olvidas de envolver las llamadas API con fromPromise ?:
// ... mergeMap((res: any) => fromPromise(deleteCallHistory(res))), // now pipeline contains response of the deleteCallHistory mergeMap((res: any) => fromPromise(setCallHistory(res.param))), //... Para ejecutar N llamadas API en secuencia, use concat :
import { concat } from 'rxjs'; // ... mergeMap((res: any) => concat( of(deleteCallHistory(res))), of(setCallHistory(res.param))), ), //... Para ejecutar N llamadas API en paralelo, use merge :
import { merge } from 'rxjs'; // ... mergeMap((res: any) => merge( of(deleteCallHistory(res))), of(setCallHistory(res.param))), ), //...¿Por qué estás llamando a mergeMap y uso de en el interior?
Los siguientes están muy cerca de ser equivalentes:
mergeMap((res: any) => of(deleteCallHistory(res))) map((res: any) => deleteCallHistory(res)))Ambos pasarán el resultado de deleteCallHistory en la secuencia. Es probable que el error esté ahí. Si deleteCallHistory devuelve un observable, ese observable nunca se ejecutará, ya que el resultado es un observable envuelto en un observable de .
Entonces, si deleteCallHistory devuelve una promesa u observable, puede simplemente llamar a mergeMap sin tener que envolver deleteCallHistory en nada:
mergeMap((res: any) => deleteCallHistory(res))Esto también podría ser un problema al llamar a setCallHistory . Si no necesita pasar el resultado, puede usar tap o do y si devuelve un observable o una promesa, entonces no use of .