代码之家 › 专栏 › 技术社区 › Eliya Cohen

NGXS Devtools不代表当前状态

ngxs redux angular

0

Eliya Cohen · 技术社区 · 7 年前

所以我开始使用NGXS,通过Redux Devtools检查我的商店有一些困难

NGXS has devtools package Redux Devtools Extension .

AppModule 进口:

imports: [
  NgxsModule.forRoot([ProjectState, AuthState], {developmentMode: true}),
  ...
  NgxsReduxDevtoolsPluginModule.forRoot(),
]

关于我的 AuthState

export class AuthState implements NgxsOnInit {

    constructor(private auth: AuthService) {}

    ngxsOnInit({dispatch}: StateContext<AuthStateModel>) {
      console.log('State initialized, now getting auth');
      dispatch(CheckAuthSession);
    }

    @Action(CheckAuthSession)
    checkSession({patchState}: StateContext<AuthStateModel>) {
      return this.auth.user$.pipe(
        tap((user) => patchState({initialized: true, user: user})),
      );
    }

当我在Google Chrome上打开控制台时,我得到了

console.log('State initialized, now getting auth')

并加载Auth属性。不过,在Redux Devtools上,我只看到:

行动 CheckAuthSession 没有被派遣
auth.initialized false 即使当我用控制台记录它时 true .

之前行动。我不确定这种行为是否正确。

当我加上 take(1) 管道在 tap checkSession 方法,它不知怎么起作用。我不知道为什么。

1 回复 | 直到 7 年前

1

2

Eliya Cohen 7 年前

我没有在Devtools上看到我的操作的原因是,由于我没有订阅,操作从未结束。换句话说,如果您有一个返回可观测值的操作,那么在订阅完成之前,它不会显示在Devtools上。

在我的示例中,我不想完成对操作处理程序的订阅,因为我需要听取 user$ .

我删除了 patchState({initialized: true, user: user}) 从 checkSession
我补充说 tap((user) => dispatch(new UpdateAuth(user)) 在管道的内部在里面 检查会话
我创建了一个名为 onUpdateAuth(user: User) 被称为 UpdateAuth 正在触发操作

就像这样:

@Action(UpdateAuth)
onUpdateAuth({patchState}: StateContext<AuthStateModel>, {user}: UpdateAuth) {
    patchState({user});
}

花了一些时间才弄明白,但毕竟,这样做更有意义。