这是我的实际数组:
let mainArray= [
{
value: '/AG_TURF-123',
label: 'Ag & Turf',
checked: false,
id:123,
children: [
{
value: '/AG_TURF-123/TRACTOR-456',
label: 'Tractors',
checked: false,
id:456,
children: [
{
value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series',
label: 'Large (7, 8, 9) Series',
checked: false,
id:789,
children: [{
value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series/7-family-tractor',
label: '7 Family Tractor',
checked: false,
id:101112
},{
value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series/8-family-tractor',
label: '8 Family Tractor',
checked: false,
id:131415
},{
value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series/9-family-tractor',
label: '9 Family Tractor',
checked: false,
id:161718
}],
},
{
value: '/app/Http/routes.js',
label: 'routes.js',
checked: false,
id:181920
},
],
},
{
value: '/app/Providers',
label: 'Providers',
checked: false,
id:212223,
children: [{
value: '/app/Http/Providers/EventServiceProvider.js',
label: 'EventServiceProvider.js',
checked: false,
id:242526
}],
},
],
},
{
value: '/config',
label: 'config',
checked: false,
id:272829,
children: [
{
value: '/config/app.js',
label: 'app.js',
checked: false,
id:303132
},
{
value: '/config/database.js',
label: 'database.js',
checked: false,
id:333435
},
],
},
{
value: '/public',
label: 'public',
checked: false,
id:353637,
children: [
{
value: '/public/assets/',
label: 'assets',
checked: false,
id:383940,
children: [{
value: '/public/assets/style.css',
label: 'style.css',checked: false,
id:404142
}],
},
{
value: '/public/index.html',
label: 'index.html',
checked: false,
id: 434445
},
],
},
{
value: '/.env',
label: '.env',
checked: false,
id: 464748
},
{
value: '/.gitignore',
label: '.gitignore',
checked: false,
id: 495051
},
{
value: '/README.md',
label: 'README.md',
checked: false,
id: 525354
},
];
这是我的价值清单:
const ids=[525354,123,131415];
如果ID匹配,我想将checked
设置为true
。
我的主阵列可能会深入6到7步。
我到目前为止所做的事情:
setCheckedFlagToItems(checkList, items) {
return items.map((item) => {
const node = item;
if (checkList.indexOf(node.id) !== -1) {
node.checked = true;
}
if ((node.children) && (Array.isArray(node.children) && node.children.length > 0)) {
this.setCheckedFlagToItems(checkList, node.children);
}
return node;
}, this);
}
但它不像往常一样工作。
答案 0 :(得分:6)
您可以使用带有命名函数的迭代和递归方法作为Array#forEach
的回调。
let mainArray = [{ value: '/AG_TURF-123', label: 'Ag & Turf', checked: false, id: 123, children: [{ value: '/AG_TURF-123/TRACTOR-456', label: 'Tractors', checked: false, id: 456, children: [{ value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series', label: 'Large (7, 8, 9) Series', checked: false, id: 789, children: [{ value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series/7-family-tractor', label: '7 Family Tractor', checked: false, id: 101112 }, { value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series/8-family-tractor', label: '8 Family Tractor', checked: false, id: 131415 }, { value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series/9-family-tractor', label: '9 Family Tractor', checked: false, id: 161718 }] }, { value: '/app/Http/routes.js', label: 'routes.js', checked: false, id: 181920 }] }, { value: '/app/Providers', label: 'Providers', checked: false, id: 212223, children: [{ value: '/app/Http/Providers/EventServiceProvider.js', label: 'EventServiceProvider.js', checked: false, id: 242526 }] }] }, { value: '/config', label: 'config', checked: false, id: 272829, children: [{ value: '/config/app.js', label: 'app.js', checked: false, id: 303132 }, { value: '/config/database.js', label: 'database.js', checked: false, id: 333435 }] }, { value: '/public', label: 'public', checked: false, id: 353637, children: [{ value: '/public/assets/', label: 'assets', checked: false, id: 383940, children: [{ value: '/public/assets/style.css', label: 'style.css', checked: false, id: 404142 }] }, { value: '/public/index.html', label: 'index.html', checked: false, id: 434445 }] }, { value: '/.env', label: '.env', checked: false, id: 464748 }, { value: '/.gitignore', label: '.gitignore', checked: false, id: 495051 }, { value: '/README.md', label: 'README.md', checked: false, id: 525354 }],
ids = [525354, 123, 131415];
mainArray.forEach(function iter(a) {
if (ids.includes(a.id)) {
a.checked = true;
}
Array.isArray( a.children) && a.children.forEach(iter);
});
console.log(mainArray);

.as-console-wrapper { max-height: 100% !important; top: 0; }

答案 1 :(得分:1)
如果您的id
是“唯一”(每个id
属性只有一个唯一对象),您还可以将此操作拆分为两个步骤:
id: item
ids
以检索此对象中的项目。如果您发现自己通过id
查找了许多对象,则可能更容易创建此临时表示。
地图的创建使用类似于另一个答案的递归:只要item
包含children
数组,它就会在返回之前将它们添加到地图对象中。
const mainArray = [{ value: '/AG_TURF-123', label: 'Ag & Turf', checked: false, id: 123, children: [{ value: '/AG_TURF-123/TRACTOR-456', label: 'Tractors', checked: false, id: 456, children: [{ value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series', label: 'Large (7, 8, 9) Series', checked: false, id: 789, children: [{ value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series/7-family-tractor', label: '7 Family Tractor', checked: false, id: 101112 }, { value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series/8-family-tractor', label: '8 Family Tractor', checked: false, id: 131415 }, { value: '/AG_TURF-123/TRACTOR-456/Large-7-8-9-series/9-family-tractor', label: '9 Family Tractor', checked: false, id: 161718 }] }, { value: '/app/Http/routes.js', label: 'routes.js', checked: false, id: 181920 }] }, { value: '/app/Providers', label: 'Providers', checked: false, id: 212223, children: [{ value: '/app/Http/Providers/EventServiceProvider.js', label: 'EventServiceProvider.js', checked: false, id: 242526 }] }] }, { value: '/config', label: 'config', checked: false, id: 272829, children: [{ value: '/config/app.js', label: 'app.js', checked: false, id: 303132 }, { value: '/config/database.js', label: 'database.js', checked: false, id: 333435 }] }, { value: '/public', label: 'public', checked: false, id: 353637, children: [{ value: '/public/assets/', label: 'assets', checked: false, id: 383940, children: [{ value: '/public/assets/style.css', label: 'style.css', checked: false, id: 404142 }] }, { value: '/public/index.html', label: 'index.html', checked: false, id: 434445 }] }, { value: '/.env', label: '.env', checked: false, id: 464748 }, { value: '/.gitignore', label: '.gitignore', checked: false, id: 495051 }, { value: '/README.md', label: 'README.md', checked: false, id: 525354 }];
// We reduce the array of nested items in to one object of:
// { id: item }
const idMap = mainArray.reduce(function merge(map, node) {
map[node.id] = node;
if (Array.isArray(node.children)) {
node.children.reduce(merge, map);
}
return map;
}, {});
const ids = [525354, 123, 131415];
// Whenever you need an item, you can get it
// using idMap[id]
const items = ids.map(id => idMap[id]);
items.forEach(item => item.checked = true);
// or: ids.forEach(id => idMap[id].checked = true)