Ngrx动作分派两次

时间:2020-10-21 09:11:09

标签: angular ngrx

我是Ngrx的新手,并且是第一次使用它。我建立了一个带有主要ngrx存储区( Auth )的angular应用程序,该存储区具有登录和注销操作,用于保留记录的用户数据。此外,我还为所有其他功能创建了一个延迟加载的存储(功能),以保留角色,权限和其他实体之类的其他内容。 现在,当我要对实体执行操作(例如角色)时,我创建了三个操作(例如:用于添加角色 addRole roleAdded ErrorAddingRole )。当执行任何操作时,一切正常:如果我在devtools中添加角色,则在副作用没有引发任何错误的情况下,看到调度了 addRole 操作和 roleAdded 操作,否则 errorAddingRole 。其他实体上的所有其他粗体操作也是如此。 当然,所有最终操作( roleAdded userAdded permissionLoaded errorLoadingRoles ...)都在内部起步动作的效果,永远不要直接作用。 除了当我调度最终的注销操作(属于主要 Auth 存储区)时,其他所有操作都运行良好之外,所有在该部分中调度的最终操作都将再次调度,从而对稳定性产生破坏性影响我的应用程序。奇怪的是,只有在分派注销操作之后,所有其他最终操作才被再次分派。在我按注销之前,一切正常。

怎么了?

以下是操作示例:

export const loadAllRoles = createAction(
  "[Roles Resolver] Load All Roles"
);
export const allRolesLoaded = createAction(
  "[Load Roles Effect] All Roles Loaded",
  props<{role_situation: Role_situation}>()
);
export const errorLoadingRoles = createAction(
  "[Load Roles Effect] Error Loading Roles"
);

export const saveRole = createAction(
  '[Roles] save',
  props<{role: Partial<Role>}>()
);
export const roleSaved = createAction(
  '[Roles] saved',
  props<{role: Partial<Role>}>()
);
export const errorSavingRole = createAction(
  '[Roles] Error Saving Role'
);

,这里是一个效果示例:

roleAdded$ = createEffect(() =>
this.actions$
  .pipe(
    ofType(RolesAction.roleAdded),
    tap(action => {
      const localeRoleSituation = localStorage.getItem('situazioneRuoli');
      if (localeRoleSituation) {
        const localeRoleSituationObj = JSON.parse(localeRoleSituation);
        const newRoleSituationObj = {
          ruoli: [...localeRoleSituationObj.ruoli, action.ruolo],
          permessi: localeRoleSituationObj.permessi,
          relazioneRuoliPermessi: localeRoleSituationObj.relazioneRuoliPermessi
        }
        const newRoleSituation = JSON.stringify(newRoleSituationObj);
        localStorage.setItem('situazioneRuoli', newRoleSituation);
        this.watchdog.writeWatchdog({type: LOGTYPE.INFO, severity: LOGSEVERITY.NONE, message: `L'utente ha aggiunto il ruolo ${action.ruolo.ruolo}`});
        this.router.navigate(['/', 'functionalities', 'role', action.ruolo.id_ruolo, 'edit']).then()
      }
    })
  ), {dispatch: false}
);

addRole$ = createEffect(() =>
this.actions$
  .pipe(
    ofType(RolesAction.addRole),
    mergeMap(action => this.rolesHttpService.addRole(action.role)
      .pipe(
        map(result => roleAdded({ruolo: result})),
        catchError((error) => {
          this.watchdog.writeWatchdog({type: LOGTYPE.ERROR, severity: LOGSEVERITY.HIGHT, message: `Si è verificato un errore durante l'eliminazione del ruolo ${action.role.id_ruolo}`})
          return of(errorAddingRole)
        })
      )
    )
  )

);

0 个答案:

没有答案