NgRx selector无法查询获取Store中已存数据的问题求助

• Selector取值逻辑和实际Store结构不匹配：createSelector的首个投影函数接收的是全局根Store状态，从Redux DevTools可以看到根状态结构为{ user: UserState }，users数组存放在根状态的user属性下。现有代码直接从入参state上读取users字段，等价于访问根State.users，该字段在根状态上不存在，因此始终取不到值。由于代码中手动将入参类型标注为UserState，TypeScript编译时不会抛出类型错误，运行时访问不存在的字段只会返回undefined，因此不会有报错提示。
• 组件注入Store时泛型传参错误：构造函数中写的Store<UserState>不符合Store实际结构，Store服务的泛型应当接收全局根状态类型，而非单个功能模块的状态类型，进一步导致状态取值上下文错乱。

按以下步骤修改对应代码即可：

1. 修改selector.ts，先通过Feature Selector定位到user模块的状态片段，再基于该片段读取users数组：

import {createSelector, createFeatureSelector} from '@ngrx/store';
import {UserState, userFeatureKey} from "./user.reducer";

// 选中根状态下的user功能模块状态
export const selectUserState = createFeatureSelector<UserState>(userFeatureKey);

// 基于功能模块状态取users数组
export const userSelector = createSelector(
  selectUserState,
  (userState: UserState) => userState.users,
  (users) => users
)

2. 修改user.component.ts，导入全局根状态类型，修正Store注入的泛型参数：

// 从reducer注册文件中导入根State类型，路径替换为项目实际路径
import { State } from '../store/index';

@Component({
  // 组件原有配置保持不变
})
export class UserComponent {
  constructor(private store: Store<State>) {
    this.store.dispatch(loadUsers());
  }

  ngOnInit(): void {
    this.store.pipe(select(userSelector)).subscribe(users => {
      console.log("Found ", users);
      // 此处即可正常获取到Store中存储的2条用户数据
    });
  }
}

修改完成后，Selector的取值路径和实际Store结构完全匹配，订阅时即可正常拿到用户列表数据。

内容的提问来源于stack exchange，提问作者Navigator