从状态中抽象选择器和动作处理器
Abstracting selectors and action handlers from state
我想知道是否可以将 @Selectors and/or @Action 处理程序从 @State class 抽象到一个单独的文件中?随着状态变得越来越大并且选择器越来越复杂,我想将它们移动到一个单独的文件中以保持状态 class 更清晰。在 NGXS 中有什么方法可以做到这一点吗?
编辑:为了以后参考,我在NGXS slack channel上得到了答案,确实是可以的。我们可以创建一个单独的选择器 class 来存储我们所有的选择器,将感兴趣的状态作为参数传递给它们。
export class EntityStateSelectors {
@Selector([EntityState])
thing(state: EntityStateModel) {
return state.thing;
}
}
到目前为止我还没有想出如何对动作处理程序做同样的事情,但是将选择器提取到一个单独的文件已经清理了状态 class 很多!
您可以为您的选择器创建一个单独的文件,强烈推荐。您可以创建一个像 app.selectors.ts
这样的文件:
export class AppSelectors {
@Selector([AppState])
static viewModel(state: AppStateModel) {
// your selector logic here
}
}
然后你就可以像这样在你的组件中正常使用了:
@Component({...})
export class AppComponent {
@Select(AppSelectors.viewModel) vm$: Observable<ViewModel>;
}
这大大减小了 app.state.ts
文件的大小,因为它只留下了操作处理程序。此外,这使您的代码更易于测试,因为您的选择器只是纯函数
我想知道是否可以将 @Selectors and/or @Action 处理程序从 @State class 抽象到一个单独的文件中?随着状态变得越来越大并且选择器越来越复杂,我想将它们移动到一个单独的文件中以保持状态 class 更清晰。在 NGXS 中有什么方法可以做到这一点吗?
编辑:为了以后参考,我在NGXS slack channel上得到了答案,确实是可以的。我们可以创建一个单独的选择器 class 来存储我们所有的选择器,将感兴趣的状态作为参数传递给它们。
export class EntityStateSelectors {
@Selector([EntityState])
thing(state: EntityStateModel) {
return state.thing;
}
}
到目前为止我还没有想出如何对动作处理程序做同样的事情,但是将选择器提取到一个单独的文件已经清理了状态 class 很多!
您可以为您的选择器创建一个单独的文件,强烈推荐。您可以创建一个像 app.selectors.ts
这样的文件:
export class AppSelectors {
@Selector([AppState])
static viewModel(state: AppStateModel) {
// your selector logic here
}
}
然后你就可以像这样在你的组件中正常使用了:
@Component({...})
export class AppComponent {
@Select(AppSelectors.viewModel) vm$: Observable<ViewModel>;
}
这大大减小了 app.state.ts
文件的大小,因为它只留下了操作处理程序。此外,这使您的代码更易于测试,因为您的选择器只是纯函数