Hola, tengo un problema al ejecutar esta función en la que intento filtrar esta serie de objetos y luego me estoy reorganizando reasignando mi identificación con el índice del .map. El problema que ocurre es que el .filter no está eliminando/eliminando elementos. en la función. Aquí está mi código como referencia: ¿Cuál sería la mejor solución para esto? Cualquier entrada sería útil gracias.
const removeData = (id) => { const del = idleData.filter(idle => id !== idle.id).map((item,index) => ( { id: index, days: item.day, comments: item.comments, cost: item.cost, reason: item.reason, portCallVoyageId: item.portCallVoyageId, changedBy: item.changedBy } )); setIdleData(del); }Aquí está idleData e inactivo:
idleData = [{ id: 0, cost: 10, days: 10, comments: 'comment 1', reason: "reason 1", changedBy: "user1" }, { id: 1, cost: 20, days: 20, comments: 'comment 2', reason: "reason 2", changedBy: "user2" }]; idle = 0;Acabo de probar su código y creo que funciona bien y el posible problema está en la variable idle .
Reescribí ligeramente el código fuente.
const idleData = [ {id: 0,cost: 10,days: 10,comments: 'comment 1',reason: "reason 1",changedBy: "user1"}, {id: 1,cost: 20,days: 20,comments: 'comment 2',reason: "reason 2",changedBy: "user2"}, {id: 2,cost: 30,days: 30,comments: 'comment 3',reason: "reason 3",changedBy: "user3"}, {id: 3,cost: 40,days: 40,comments: 'comment 4',reason: "reason 4",changedBy: "user4"}, {id: 4,cost: 50,days: 50,comments: 'comment 5',reason: "reason 5",changedBy: "user5"}, ]; //idle = 0; const removeData = (omitId) => { const del = idleData .filter(({ id }) => id !== omitId) .map((item, index) => ({ ...item, id: index })); console.log(del); // setIdleData(del); }; console.log(del); // setIdleData(del); }; removeData(0); .as-console-wrapper{min-height: 100%!important; top: 0} Mismo resultado pero sin .filter
const idleData = [ {id: 0,cost: 10,days: 10,comments: 'comment 1',reason: "reason 1",changedBy: "user1"}, {id: 1,cost: 20,days: 20,comments: 'comment 2',reason: "reason 2",changedBy: "user2"}, {id: 2,cost: 30,days: 30,comments: 'comment 3',reason: "reason 3",changedBy: "user3"}, {id: 3,cost: 40,days: 40,comments: 'comment 4',reason: "reason 4",changedBy: "user4"}, {id: 4,cost: 50,days: 50,comments: 'comment 5',reason: "reason 5",changedBy: "user5"}, ]; //idle = 0; const removeData = (omitId) => { const del = idleData .flatMap((item, index) => (item.id !== omitId) ? { ...item, id: index } : []); console.log(del); // setIdleData(del); }; removeData(0); .as-console-wrapper{min-height: 100%!important; top: 0}¡Tu código está funcionando como un campeón! Estoy agregando el fragmento de código a continuación. Por favor, hágame saber a qué desafíos se enfrenta. Lo modificaré según la entrada.
demostración:
const idleData = [{ id: 0, cost: 10, days: 10, comments: 'comment 1', reason: "reason 1", changedBy: "user1" }, { id: 1, cost: 20, days: 20, comments: 'comment 2', reason: "reason 2", changedBy: "user2" }]; const removeData = (id) => { const del = idleData.filter(idle => id !== idle.id).map((item,index) => ( { id: index, days: item.day, comments: item.comments, cost: item.cost, reason: item.reason, portCallVoyageId: item.portCallVoyageId, changedBy: item.changedBy } )); console.log(del); } removeData(0);