递归地改变树是禁用布尔值

Question

给定一棵树:

type DataType = {
id: string;
access: 'view' | 'none';
isDisabled: boolean;
children: DataType[];
};
const Data: DataType = {
id: '1',
access: 'view',
isDisabled: false,
children: [
{
id: '2',
access: 'view',
isDisabled: false,
children: [
{
id: '3',
access: 'view',
isDisabled: false,
children: [],
},
{
id: '4',
access: 'view',
isDisabled: false,
children: [],
},
],
},
{
id: '5',
access: 'view',
isDisabled: false,
children: [],
},
],
};

我想做的是当一个节点的访问改变时，isDisabled布尔值将根据以下规则改变:

如果access是'view'， isDisabled将保持false如果access为'none'，当前节点的isDisabled将为false，但它的子节点的isDisabled将为true。

这是我现在的文件:

export const find = (data, selectedId, access) => {
if (!selectedId || !access) {
return data;
}
if (data.id === selectedId) {
data = changeAccess(data, selectedId, access);
return data;
}
data.children.map((child) => find(child, selectedId, access));
return data; // this is where the problem lies, but not sure how to fix it
};
export const changeAccess = (data, selectedId, access) => ({
...data,
access: access,
isDisabled: data.id !== selectedId && access !== 'view' ? true : false, // this toggles isDisabled
children: data.children?.map((child) =>
changeAccess(child, selectedId, access)
),
});

所以当我调用find

const result = find(Data, '2', 'none');

结果应该等于以下内容:

const DataAfter: DataType = {
id: '1',
access: 'view',
isDisabled: false,
children: [
{
id: '2',
access: 'none',
isDisabled: false,
children: [
{
id: '3',
access: 'none',
isDisabled: true,
children: [],
},
{
id: '4',
access: 'none',
isDisabled: true,
children: [],
},
],
},
{
id: '5',
access: 'view',
isDisabled: false,
children: [],
},
],
};

Answer 1

代码中高亮显示的部分:

data.children.map((child) => find(child, selectedId, access));
return data; // this is where the problem lies, but not sure how to fix it

…没有使用.map()返回的数组。因此，data返回其原始状态。

当映射的子数组有一个或多个新对象时，应该返回一个新对象:

const children = data.children.map((child) => find(child, selectedId, access));
if (data.children.some((child, i) => child !== children[i])) {
data = {
...data,
children
};
}
return data;