NGXS 状态不变

Posted 2023-02-19

【中文标题】NGXS 状态不变

【英文标题】：NGXS State not changing

【发布时间】：2019-02-01 09:58:18

【问题描述】：

可能有人知道为什么 NGXS 状态不能在 HttpClient POST 请求中改变。

ctx.patchState()

仅适用于 HTTP POST 请求之外。

    @Action(SignIn)
    signin(ctx: StateContext<AppStateModel>,  payload : SignIn) 

        // ctx.patchState(isLoggedIn:true) this works!

        return this.api$.signin(payload)
            .pipe(
                tap((user: User) => 
                    console.log(user);
                    ctx.patchState( isLoggedIn: true )

                )
            )
            .subscribe(
                (user: User) => 
                    ctx.patchState( isLoggedIn: true )

                
            )
    

【问题讨论】：

您的console.log 声明是否在tap 中被打印？

是的，数据被打印了，但是状态没有改变，只有当我在订阅之外调用 ctx.patchState() 时才会改变。

你真的应该发出一个带有加载数据的有效载荷的动作。也不要在操作内部订阅。 Ngxs 会为你订阅。

谢谢！！效果更好，我不知道 ngxs 订阅 observables，谢谢。

【参考方案1】：

实际上，状态正在发生变化，但您看不到它，因为您返回了尚未完成的订阅。换句话说 - 一旦返回的 observable 的订阅完成，您将看到该操作被分派。

正如 cmets 中所说，返回的操作的 observable 正在后台订阅，因此无需再次订阅。

话虽如此，您可以在管道中传递take(1)。

它的作用是触发一次后完成对observable的订阅。

    @Action(SignIn)
    signin(ctx: StateContext<AppStateModel>,  payload : SignIn) 
        return this.api$.signin(payload)
            .pipe(
                take(1), // <-- Add that
                tap((user: User) => ctx.patchState( isLoggedIn: true ))
            );
    

【讨论】：

问题 - take(1) 真的有必要还是只是“好的文档”？如果登录 API 正在与外部服务对话，它似乎不太可能发出多个值并无论如何完成。无论如何，我可能会表示我只对发出的第一个值感兴趣......

只要不需要一直订阅 observable，建议在不再需要时完成订阅，避免内存泄漏。更多信息 - ***.com/questions/38008334/…

谢谢 - 我点击了你的链接，然后找到了这个，这是一个明确的声明：reactivex.io/documentation/contract.html 当一个 Observable 向其观察者发出 OnError 或 OnComplete 通知时，这将结束订阅。观察者不需要发出 Unsubscribe 通知来结束由 Observable 以这种方式结束的订阅。