https://stackblitz.com/edit/ngrx-vanilla
快速介绍:
>它在app / store中有一个root商店
>它在app / features中延迟加载了两个模块
>它在app / commons中有单例服务
三页:
>行动项目:路由到此页面会触发随机生成三个愚蠢的公司行动项目
>用户:基本主人>详细的redux实现与路由器支持
>会议:提出问题的地方,点击“开始会议”,见证相关的意见交流.
问题&背景:
>我理解redux中的所有数据更新都是通过操作实现的
>“效果”库用于处理异步事件,以便根据第三方事件和异步调用分派新操作.
> app / common / meeting / service模仿例如websocket或firebase实时数据库推送更新的行为.
收到更新后(在app / store / effects / meeting.effects.ts中说明),将调度新操作.
最后,问题是:让公共服务了解商店是否是一种干净的做法?将一个监听器注册到websocket / firebase实时数据库以便在推送数据时调度操作的最佳位置在哪里?
在这里,我做了一个效果(meeting.effects)对meetingActions.START_MEETING操作类型做出反应,每当推送数据时,都会向商店发送更新订单,但由于我提出的一系列原因,这感觉不对:
>难以单独进行单元测试(需要比自身更多的上下文)
>如果出现“停止会议”操作,此方法需要存储订阅(或?)以停止订阅.在我的方法中,无法控制在荒野中创造的可观察物.
这些案件通常如何处理?
解决方法
@Injectable() class WebsocketService{ private socket$:Observable<Action> getActions():Observable<Action>{ if(!this.socket$) { this.socket$= Observable.webSocket(url).pipe( map(functionToMapActions),shareReplay(1) ); } return this.socket$; } }
其中functionToMapActions将webSocket事件映射到动作,我建议最后添加shareReplay
运算符,以便我们只读取一次webSocket.
Observable.webSocket
连接到webSocket,并在它们到达时发出事件
当你怀疑webService.getActions()时将建立webSocket连接
您可以在@Effects初始化see here中订阅websocket操作
@Effect() init$= this.websocketService.getActions();
这将在您的应用程序启动后立即发出所有操作(如果在根模块中生效)或者如果模块在延迟加载模块中则加载模块;
或者,如果您对有限的一系列行为感兴趣,您可以这样做
@Effect() init$= this.websocketService.getActions().pipe(filter(filterNeededActionsHere));
你也可以在这样的特定事件之后开始听动作
@Effect() init$= this.actions$.pipe( ofType('Event which marks start'),swichMapTo(this.websocketService.getActions()) );
像前面的例子一样,你也可以像以前一样过滤掉这里的行动
希望这能回答你的问题
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。