Hello I am having an issue running this function wherein im trying to filter this an array of objects then afterwards im reorganizing by reassigning my id with the index of the .map The issue that occurs is that the .filter is not deleting/removing an items in the function. Here is my code as reference: What do be the best solution of this. Any input would be helpful thank you.
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);
}
Here is idleData and idle:
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;
Just tested your code and I think it works fine and the possible problem is in the idle variable.
I slightly rewrote the source code.
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}Same result but without .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}
Your code is working like a champ! I am adding the code snippet below. Please let me know what challenges you are facing. I will modify that as per the input.
Demo :
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);