I have const data, and i need filter cards array by obj field company For example by company: 'Symu.co'
const data = {
lanes: [
{
id: 'lane1',
header: 'Quened',
label: '',
cards: [
{id: 'Task1', title: 'Wordpress theme', company: 'Symu.co', price: 1500, user: 'michelle'},
]
},
{
id: 'lane2',
header: 'Planning',
label: '',
cards: [
{id: 'Task2', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene'},
{id: 'Task3', title: 'New website', company: 'Symu.co', price: 1500, user: 'lyall'},
{id: 'Task4', title: 'Dashboard', company: 'Microsoft', price: 1500, user: 'john'},
{id: 'Task5', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'dominic'},
]
},
{
id: 'lane3',
header: 'Design',
label: '',
cards: [
{id: 'Task6', title: 'New Logo', company: 'Google', price: 1500, user: 'michelle'},
{id: 'Task7', title: 'New website', company: 'JCD.pl', price: 1500, user: 'dominic'},
{id: 'Task8', title: 'New website', company: 'Themeforest', price: 1500, user: 'john'},
{id: 'Task9', title: 'Dashboard', company: 'JCD.pl', price: 1500, user: 'jolene'},
]
},
{
id: 'lane4',
header: 'Development',
label: '()',
cards: [
{id: 'Task10', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'john'},
{id: 'Task11', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'},
{id: 'Task12', title: 'Dashboard', company: 'Google', price: 1500, user: 'dominic'},
]
},
{
id: 'lane5',
header: 'Testing',
label: '()',
cards: [
{id: 'Task13', title: 'Landing page', company: 'JCD.pl', price: 1500, user: 'lyall'},
]
},
{
id: 'lane6',
header: 'Production',
label: '()',
cards: [
{id: 'Task14', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene'},
{id: 'Task15', title: 'New website', company: 'Themeforest', price: 1500, user: 'michelle'},
{id: 'Task16', title: 'Dashboard', company: 'Facebook', price: 1500, user: 'lyall'},
]
},
{
id: 'lane7',
header: 'Completed',
label: '()',
cards: [
{id: 'Task17', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'john'},
{id: 'Task18', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'},
]
},
]
};
My code , but i don`t know how to right do it
for(let i = 0; i < data.lanes.length; i++) {
var changeCards = data.lanes[i].cards.filter(function(obj) {
return obj.company === 'Symu.co';
console.log(changeCards);
});
}
in output i need to get new var new array as example in output i need to get new var new array as example in output i need to get new var new array as example in output i need to get new var new array as example in output i need to get new var new array as example in output i need to get new var new array as example in output i need to get new var new array as example
var newArray = {
lanes: [
{
id: 'lane1',
header: 'Quened',
label: '',
cards: [
{id: 'Task1', title: 'Wordpress theme', company: 'Symu.co', price: 1500, user: 'michelle'
},
]
},
{
id: 'lane2',
header: 'Planning',
label: '',
cards: [
{id: 'Task3', title: 'New website', company: 'Symu.co', price: 1500, user: 'lyall'}
]
},
{
id: 'lane3',
header: 'Design',
label: '',
cards: [
]
},
{
id: 'lane4',
header: 'Development',
label: '()',
cards: [
{id: 'Task11', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'},
]
},
{
id: 'lane5',
header: 'Testing',
label: '()',
cards: [
]
},
{
id: 'lane6',
header: 'Production',
label: '()',
cards: [
]
},
{
id: 'lane7',
header: 'Completed',
label: '()',
cards: [
{id: 'Task18', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'},
]
},
]
};
But i dont know how to do it
Help please!
Thanks a lot
You can use the functions reduce, forEach and filter to build the desired output.
const data = { lanes: [ { id: 'lane1', header: 'Quened', label: '', cards: [ {id: 'Task1', title: 'Wordpress theme', company: 'Symu.co', price: 1500, user: 'michelle'}, ] }, { id: 'lane2', header: 'Planning', label: '', cards: [ {id: 'Task2', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene'}, {id: 'Task3', title: 'New website', company: 'Symu.co', price: 1500, user: 'lyall'}, {id: 'Task4', title: 'Dashboard', company: 'Microsoft', price: 1500, user: 'john'}, {id: 'Task5', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'dominic'}, ] }, { id: 'lane3', header: 'Design', label: '', cards: [ {id: 'Task6', title: 'New Logo', company: 'Google', price: 1500, user: 'michelle'}, {id: 'Task7', title: 'New website', company: 'JCD.pl', price: 1500, user: 'dominic'}, {id: 'Task8', title: 'New website', company: 'Themeforest', price: 1500, user: 'john'}, {id: 'Task9', title: 'Dashboard', company: 'JCD.pl', price: 1500, user: 'jolene'}, ] }, { id: 'lane4', header: 'Development', label: '()', cards: [ {id: 'Task10', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'john'}, {id: 'Task11', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'}, {id: 'Task12', title: 'Dashboard', company: 'Google', price: 1500, user: 'dominic'}, ] }, { id: 'lane5', header: 'Testing', label: '()', cards: [ {id: 'Task13', title: 'Landing page', company: 'JCD.pl', price: 1500, user: 'lyall'}, ] }, { id: 'lane6', header: 'Production', label: '()', cards: [ {id: 'Task14', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene'}, {id: 'Task15', title: 'New website', company: 'Themeforest', price: 1500, user: 'michelle'}, {id: 'Task16', title: 'Dashboard', company: 'Facebook', price: 1500, user: 'lyall'}, ] }, { id: 'lane7', header: 'Completed', label: '()', cards: [ {id: 'Task17', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'john'}, {id: 'Task18', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'}, ] },]};
function filterBy(target) {
return data.lanes.reduce((a, {id, header, label, cards}) => {
a.lanes.push({id, header, label, cards: cards.filter(({company}) => company === target)});
return a;
}, {lanes: []});
}
var result = filterBy('Symu.co');
console.log(result);.as-console-wrapper { max-height: 100% !important; top: 0; }