共计 1532 个字符,预计需要花费 4 分钟才能阅读完成。
loading 从 true 变为 false:
单从这个 initiator 栏,是很难找到是哪一行利用代码,发动的这个 cart 加载:
依据 [Cart] Load Cart
关键字搜寻是能找到的:
最初找到了精确的代码行数,调用 CartConnector 去读取数据:
首先查看针对这个 cart,是否存在 pending 申请:
应用 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:
如果有,就不持续进行上来了,通过 filter
操作符阻止进一步执行。
能进行到代码 60 行,阐明此时没有 pendingProcess 施加在 Cart 上。
ActiveCartServicei 依赖到 MultiCartService:
在 isStableSelector
里加上打印语句:
会频繁触发:
比方上面这个调用会触发:
此处加载以后 user 的 cart:
为什么会触发上面这段代码?因为 Spartacus 有大量 createSelect 的调用:
如下图所示:
createSelector 的输出参数由一个 Selector 和 projector 组成。
createSelector 反对数量可变的参数,前 n – 1 个参数都被当成 selector 解决,最初一个参数为 projector:
下图 getCartIsStableSelectorFactory
实现体的第 58 行代码为什么会被调用?
是因为 MultiCartService 的 isStable 办法在 Cart Load 场景里被调用?
的确如此:
所以每一次可能引起 isStable 返回值发生变化的时候,getCartIsStableSelectorFactory
里的 projector 都会被调用,从新计算 isStable 的最新值。