likes
comments
collection
share

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

作者站长头像
站长
· 阅读数 16

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

loading 从 true 变为 false:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

单从这个 initiator 栏,是很难找到是哪一行应用代码,发起的这个 cart 加载:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

根据 [Cart] Load Cart 关键字搜索是能找到的:

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

最后找到了准确的代码行数,调用 CartConnector 去读取数据:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

首先查看针对这个 cart,是否存在 pending 请求:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

使用 withLatestFrom 操作符,查看这个 cart 是否有 PendingProcesses

 withLatestFrom(
              this.store.pipe(
                select(
                  getCartHasPendingProcessesSelectorFactory(payload.cartId)
                )
              )
            )

这里使用 withLatestFrom,从另一个 Observable 里进行数据查询。

下面这段代码组合了两个按照不同时间间隔,分别发射递增整数序列的 Observable:

// RxJS v6+
import { withLatestFrom, map } from 'rxjs/operators';
import { interval } from 'rxjs';

//emit every 5s
const source = interval(5000);
//emit every 1s
const secondSource = interval(1000);
const example = source.pipe(
  withLatestFrom(secondSource),
  map(([first, second]) => {
    return `First Source (5s): ${first} Second Source (1s): ${second}`;
  })
);
/*
  "First Source (5s): 0 Second Source (1s): 4"
  "First Source (5s): 1 Second Source (1s): 9"
  "First Source (5s): 2 Second Source (1s): 14"
  ...
*/
const subscribe = example.subscribe(val => console.log(val));

因为 host Observable 的时间间隔为 5 秒,所以每个5秒钟,console 面板新增一条输出,且 host Observable 的递增值为 5,但此时因为使用 withLatestFrom 操作符传入的输入 Observable 的时间间隔为 1 秒,因此每个 5 秒过去后,second Observable 的递增序列为 5:

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

如果有,就不继续进行下去了,通过 filter 操作符阻止进一步执行。

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

能进行到代码 60 行,说明此时没有 pendingProcess 施加在 Cart 上。

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

ActiveCartServicei 依赖到 MultiCartService:

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

isStableSelector 里加上打印语句:

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

会频繁触发:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

比如下面这个调用会触发:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

此处加载当前 user 的 cart:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

为什么会触发下面这段代码?因为 Spartacus 有大量 createSelect 的调用:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

如下图所示:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

createSelector 的输入参数由一个 Selector 和 projector 组成。

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

createSelector 支持数量可变的参数,前 n - 1 个参数都被当成 selector 处理,最后一个参数为 projector:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

下图 getCartIsStableSelectorFactory 实现体的第 58 行代码为什么会被调用?

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

是因为 MultiCartService 的 isStable 方法在 Cart Load 场景里被调用?

SAP 电商云 Spartacus UI ActiveCartService isStable 调用

确实如此:SAP 电商云 Spartacus UI ActiveCartService isStable 调用

所以每一次可能引起 isStable 返回值发生变化的时候,getCartIsStableSelectorFactory 里的 projector 都会被调用,重新计算 isStable 的最新值。