将ngrx效果与withLatestFrom运算符一起使用时的奇怪行为

Posted 2023-03-13

【中文标题】将ngrx效果与withLatestFrom运算符一起使用时的奇怪行为

【英文标题】：Weird behavior when using ngrx effect with withLatestFrom operator

【发布时间】：2020-06-11 01:45:25

【问题描述】：

我有下面的选择器

export const selectUserData = createSelector(selectState, state => 
    return state.user;
);

在我看来，如果我使用 withLatestFrom 而不使用 []

withLatestFrom(
     this.commonStore.pipe(select(selectUserData))
)

loadUser$ = createEffect(() =>
        this.actions$.pipe(
            ofType(UserActionsTypes.GetUserSuccess),
            withLatestFrom(
                this.commonStore.pipe(select(selectUserData))
            ),
            mergeMap(([_, user]) =>  
                  console.log(user);

console.log 将返回空数据

但是如果我将 [] 添加到 withLatestFrom

withLatestFrom(
     [this.commonStore.pipe(select(selectUserData))]
)

然后我会在mergeMap中使用subscribe来获取数据

console.log(user.subscribe(x => console.log(x)));

请注意，选择器有数据，我在 redux devtool 中检查数据是否存在。

知道它是怎么发生的吗？

【问题讨论】：

这能回答你的问题吗？ How to use withLatestFrom with a selector in ngrx?

@AndrewAllen 谢谢我试过了，但它不适用于我的情况

一切正常。尝试调试 return state.user 以查看它返回的内容 - 可能是 null 是您在我们看不到的应用程序的其他部分中流动的正确原因

【参考方案1】：

我发现问题一定是我在使用 withLatestFrom 运算符时正在监听的另一个效果的竞争条件，所以我将类型更改为 GetInitDataSuccess（CommonActionsType.GetInitDataSuccess 操作在 GetUserSuccess 之前触发）

ofType(CommonActionsType.GetInitDataSuccess)
withLatestFrom(
            this.commonStore.pipe(select(selectUserData))
        ),
        mergeMap(([_, user]) =>  
              console.log(user);