SAP Spartacus B2B Unit page Expand all按钮的工作原理

输入参数：node就是UnitTreeService.getTree返回的数据，key在这个例子为undefine：

因为activeUnitId为空，所以什么也没有执行：

最后的页面显示：

UnitTreeService里的collapseAll和expandAll，分别对应页面这两个按钮：

/*** Sets the global toggle state to _expanded_ and clears the toggle state* for individual units.*/expandAll() {this.globalToggle$.next(TREE_TOGGLE.EXPANDED);this.treeToggle$.next(new Map());}

globalToggle$是一个BehaviorSubject，主动调用next方法：

BehaviorSubject的super：Subject

Subject调用自己的next方法？

我理解错了，第35行的代码相当于：

const observers = this.observers;

这一次，treeToggle$通过pipe组装了一个Map operator：

即此处：

使用next方法调用map operator：

这个操作叫做：无中生有

使用map操作，成功生成了新的一份clean的，完整的数据：

map operator里箭头函数输入参数，在这里例子为空
map operator里箭头函数实现体
map operator里箭头函数的返回值
箭头函数返回值作为输入，传到pipe驱动的下一个operator去

在switchMap里notify下一个Operator：

上一个switchMap箭头函数的输出，传入到本次map作为输入。
this.thisArg, project字段包含了箭头函数实现体
this.project, 箭头函数的实现
本次map箭头函数的输出

所以，看这个调试的调用栈，expandAll按钮，触发者是unit-list.component.ts, 通过unit-tree.service.ts，最终会调用到unit-list.service.ts：

更多Jerry的原创文章，尽在：“汪子熙”:

SAP Spartacus B2B Unit page Expand all按钮的工作原理相关推荐

SAP Spartacus B2B Unit page convertListItem方法的工作原理
点击expand all后,触发该方法: 输入参数unit,就是从后台OCC API返回的数据: 变量node绝大部分数据来自unit,使用-, 增添了一些额外属性: 递归调用: 递归函数处理之后的结 ...
SAP Spartacus B2B Unit page OrgUnitService.getTree方法返回的结果
只有到loading为false,success为false,error为false时,才调用208行的this.loadTree加载数据: 发送一个OrgUnitActions.LoadTree的a ...
SAP Spartacus Org Unit List响应回车案件的实现原理
我在SAP Spartacus Org Unit List里,用tab键选中某个行项目后,敲回车键: 首先会在屏幕右半部份显示一个只包含布局不包含数据的页面: 待数据加载完成之后,右边也能显示完整的页 ...
SAP Spartacus Organization Unit List三个按钮的技术实现
如下图所示:Expand all,Collapse All和Add三个button的技术实现: 位于unit-list.component.html里: 上图定义的两个button标签,通过下图的ng ...
SAP Spartacus B2B Unit List跳转到Unit Detail页面的路由执行逻辑
从list页面随便点击一个项目,跳转到org明细页面: 赋值,触发set操作: _updateView里调用this._viewContainer.createEmbeddedView: NgIf里果 ...
SAP Spartacus B2B unit list页面抬头的计数逻辑的实现原理
如下图所示: 渲染完之后,Units字符串转换成ALL UNITS(16): 实现原理: <div class="title"><h3>{{viewType ...
SAP Spartacus B2B table的配置信息的merge原理
以SAP Spartacus b2b unit table的配置信息为例:位于文件units.config.ts里: 运行时,这些配置信息,被merge在table.service.ts的this.c ...
SAP Spartacus B2B 页面 Disable 按钮的显示原理
SAP Spartacus B2B 页面 disable 按钮如下图所示. 这个高亮的 disable 按钮,和左边相邻的 Edit 按钮,实现位于不同的 Component. disable 按钮有 ...
SAP Spartacus B2B OrgUnit 和 OrgUser 的路由映射差异比较
SAP Spartacus B2B 页面类似 SAP Fiori Launchpad,共有 6 个 tile(磁贴),点击某个磁贴,能跳转到对应的列表页面. 路由映射就是指点击某个 url 之后(例如 ...

SAP Spartacus B2B Unit page Expand all按钮的工作原理

SAP Spartacus B2B Unit page Expand all按钮的工作原理相关推荐

最新文章

热门文章