[英]Angular ngrx - Update store with an array inside object
我有这样的效果:
loadFolder$ = createEffect(() => {
return this.action$.pipe(
ofType(SidebarAction.loadFirmSuccess),
switchMap(action => {
const foldersList = {};
if(!action.selectedFirm) {
action.firms[0].roles.map((role: string) => {
foldersList[role.toLowerCase()] = this.sidebarService.getFolders(action.userId, action.firms[0].id.toString() , role, action.page.toString(), action.size.toString());
});
}
else {
action.selectedFirm.roles.map((role: string) => {
// tslint:disable-next-line: no-non-null-assertion
foldersList[role.toLowerCase()] = this.sidebarService.getFolders(action.userId, action.selectedFirm!.id.toString() , role, action.page.toString(), action.size.toString());
});
}
return forkJoin(foldersList).pipe(map(res => {
return SidebarAction.loadFolderSuccess({folders : res, selectedFirm: action.selectedFirm});
}));
})
);
});
它返回给我的文件夹 object 是这样的
folders: {
admin: [[{idFolder: 1, folderName: 'folder1'}], {page: 1, size: 2}, {amount: 3}],
superadmin: [[{idFolder: 1, folderName: 'folder1'}], {page: 1, size: 2}, {amount: 3}],
user: [[{idFolder: 1, folderName: 'folder1'}], {page: 1, size: 2}, {amount: 3}]
}
所有的钥匙都不存在......这取决于。
这就是问题所在,我的第一个结果是这样的:
folders: {
admin: [[{idFolder: 1, folderName: 'folder1'}, {idFolder: 2, folderName: 'folder2'}], {page: 1, size: 2}, {amount: 4}]
}
当我增加页面时,我会发送相同的操作以获得其他结果
folders: {
admin: [[{idFolder: 3, folderName: 'folder3'}, {idFolder: 4, folderName: 'folder4'}]{page: 2, size: 2}{amount: 4}]
}
这是减速器:
export const sideBarReducer = createReducer(
initialSidebarState,
on(SidebarActions.loadFolderSuccess, (state, action): SidebarState => {
return {
...state,
folders: action.folders,
selectedFirm : action.selectedFirm
};
}),
);
action.folders 可能是这样的 object
folders: {
admin: [[{idFolder: 1, folderName: 'folder1'}],{page: 1, size: 2},{amount: 3}],
superadmin: [[{idFolder: 1, folderName: 'folder1'}],{page: 1, size: 2},{amount: 3}],
user: [[{idFolder: 1, folderName: 'folder1'}],{page: 1, size: 2},{amount: 3}]
}
我想用新的更新状态以获取以前的 state,如下所示:
folders: {
admin: [[{idFolder: 1, folderName: 'folder1'}, {idFolder: 2, folderName: 'folder2'}, {idFolder: 3, folderName: 'folder3'}, {idFolder: 4, folderName: 'folder4'}],{page: 2, size: 2},{amount: 3}],
superadmin: [[{idFolder: 1, folderName: 'folder1'}],{page: 1, size: 2},{amount: 3}],
user: [[{idFolder: 1, folderName: 'folder1'}],{page: 1, size: 2},{amount: 3}]
}
但是使用减速器我看到了这个 state:
folders: {
admin: [[{idFolder: 3, folderName: 'folder3'}, {idFolder: 4, folderName: 'folder4'}],{page: 2, size: 2},{amount: 3}],
}
我尝试在 reducer 中使用展开运算符,但它不起作用。 这很明显,因为更改位于文件夹 object 中的数组中。
export const sideBarReducer = createReducer(
initialSidebarState,
on(SidebarActions.loadFolderSuccess, (state, action): SidebarState => {
return {
...state,
folders: {...state.folders, action.folders},
selectedFirm : action.selectedFirm
};
}),
);
Object spread 只做浅层合并。 您需要进行深度合并,例如您可以使用merge
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.