調(diào)試入口：this.routingService.getNextPageContext()

這個(gè) page context 直接從 store 里讀取的，靠調(diào)試 selector 是拿不到的。

我們以前學(xué)習(xí)過(guò)，當(dāng) Angular router 框架成功將瀏覽器地址欄的 url，匹配到開(kāi)發(fā)人員用 RouterModule.forChild 傳入的 routes 數(shù)組時(shí)，會(huì)拋出 RoutesRecognized 事件，如下圖所示：

if (event instanceof RoutesRecognized) {routesRecognized = event;if (!dispatchNavLate && this.trigger !== RouterTrigger.STORE) {this.dispatchRouterNavigation(event);}

Angular router 框架這里提供了一個(gè) hook，可以允許應(yīng)用開(kāi)發(fā)人員修改下一個(gè) router state，即 nextRouterState 變量：

@Injectable() export class CustomSerializerimplements fromNgrxRouter.RouterStateSerializer<ActivatedRouterStateSnapshot>

我們自己實(shí)現(xiàn)了 Angular router 框架的一個(gè)接口：

fromNgrxRouter.RouterStateSerializer

這里硬編碼了，只要 routerState 里的參數(shù)，出現(xiàn)了 productCode，我們就認(rèn)為這是一個(gè) Product page：

if (params['productCode']) {context = { id: params['productCode'], type: PageType.PRODUCT_PAGE };}

然后我們的 reducer 被調(diào)用：

這些都是之前 serializer populate 出的數(shù)據(jù)：

這里我們把 navigation target 寫(xiě)入 in-memory state, 這樣接下來(lái)的 selector，就能從 state 里讀取出 product 明細(xì)頁(yè)面的 page context 了：

疑問(wèn)至此解開(kāi)。

更多Jerry的原創(chuàng)文章，盡在：“汪子熙”:

總結(jié)

以上是生活随笔為你收集整理的SAP 电商云 Spartacus 产品明细页面的 pageContext 如何获取的？的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。