为什么调用 action 后我的效果是 运行 几次?
Why my effect is running serveral times after action is called?
我的效果是请求几个值以从服务中检索产品。 Afer dispatch REQUEST_PRODUCTS 按预期调用了一次,但是当我尝试转到路由中的其他位置时, this.apiMarketServices 被调用了几次,这触发了路由器导航,这将重定向到上一页。操作 REQUEST_PRODUCTS 被分派一次。为什么这个效果叫好几次?
我是否需要对效果添加某种停止以避免在 return GetSuccess 和 GetFailed 之后调用?
@Effect()
requestProductsFromMarket = this.actions$
.ofType(REQUEST_PRODUCTS)
.withLatestFrom(this.store)
.switchMap(([action, store]) => {
const id = store.product.id;
return this.savedProducts.getProduct(id, 'store');
})
.switchMap(_ => this.stateService.getMarketId())
.switchMap(({ marketId }) =>
this.apiMarketServices.get(MARKETS_PROFILES + marketId)
)
.withLatestFrom(this.store)
.map(([r, store]) => {
const ser = r.data.map(s => s.legId);
const storSer =
store.product.serIds;
if (storSer.every(s =>ser.includes(s))) {
this.router.navigate([
`/products/edit/${store.products.id}`
]);
return GetSuccess;
} else {
return GetFailed;
}
})
.catch(() => of(GetQueryFailed));
缺陷的解决方案与Observable有关。在调试中"this.apiMarketServices.get(MARKETS_PROFILES + marketId)"被调用了几次,我意识到这个服务是缺陷的原因:
.switchMap(({ marketId }) =>
this.apiMarketServices.get(MARKETS_PROFILES + marketId)
)
但真正的原因是 stateSevice,此行为主题已在应用程序的其他部分更新为 next。
.switchMap(_ => this.stateService.getMarketId())
为了避免这些调用,我创建了一个函数来从 BehaviorSubject 中检索当前值。
getCurrentMarketId(): ClientData {
return this.currentMarket.value; // BehaviorSubject
}
我添加了这个函数来实现每个调度效果调用一次。
...
.switchMap(([action, store]) => {
const id = store.product.id;
return this.savedProducts.getProduct(id, 'store');
})
.map(_ => this.stateService.getCurrentMarketId())
.switchMap(({ marketId }) =>
this.apiMarketServices.get(MARKETS_PROFILES + marketId)
)
我的效果是请求几个值以从服务中检索产品。 Afer dispatch REQUEST_PRODUCTS 按预期调用了一次,但是当我尝试转到路由中的其他位置时, this.apiMarketServices 被调用了几次,这触发了路由器导航,这将重定向到上一页。操作 REQUEST_PRODUCTS 被分派一次。为什么这个效果叫好几次?
我是否需要对效果添加某种停止以避免在 return GetSuccess 和 GetFailed 之后调用?
@Effect()
requestProductsFromMarket = this.actions$
.ofType(REQUEST_PRODUCTS)
.withLatestFrom(this.store)
.switchMap(([action, store]) => {
const id = store.product.id;
return this.savedProducts.getProduct(id, 'store');
})
.switchMap(_ => this.stateService.getMarketId())
.switchMap(({ marketId }) =>
this.apiMarketServices.get(MARKETS_PROFILES + marketId)
)
.withLatestFrom(this.store)
.map(([r, store]) => {
const ser = r.data.map(s => s.legId);
const storSer =
store.product.serIds;
if (storSer.every(s =>ser.includes(s))) {
this.router.navigate([
`/products/edit/${store.products.id}`
]);
return GetSuccess;
} else {
return GetFailed;
}
})
.catch(() => of(GetQueryFailed));
缺陷的解决方案与Observable有关。在调试中"this.apiMarketServices.get(MARKETS_PROFILES + marketId)"被调用了几次,我意识到这个服务是缺陷的原因:
.switchMap(({ marketId }) =>
this.apiMarketServices.get(MARKETS_PROFILES + marketId)
)
但真正的原因是 stateSevice,此行为主题已在应用程序的其他部分更新为 next。
.switchMap(_ => this.stateService.getMarketId())
为了避免这些调用,我创建了一个函数来从 BehaviorSubject 中检索当前值。
getCurrentMarketId(): ClientData {
return this.currentMarket.value; // BehaviorSubject
}
我添加了这个函数来实现每个调度效果调用一次。
...
.switchMap(([action, store]) => {
const id = store.product.id;
return this.savedProducts.getProduct(id, 'store');
})
.map(_ => this.stateService.getCurrentMarketId())
.switchMap(({ marketId }) =>
this.apiMarketServices.get(MARKETS_PROFILES + marketId)
)