美文网首页SAPSAP
SAP Spartacus pagefold学习笔记

SAP Spartacus pagefold学习笔记

作者: _扫地僧_ | 来源:发表于2021-02-11 15:36 被阅读0次

    展开Observable对象,从其operator能观察到施加在该Observable对象上的操作:

    Map操作:(event) => this.getBreakpoint(event.target.innerWidth)

    source.operator: DistinctUntilChangedOperator

    这个this.breakpointService.breakpoint$的赋值位置:果然有map和distinctUntilChanged,通过pipe链接:

    link:https://sap.github.io/spartacus-docs/above-the-fold/#page-fold-configuration

    The page fold is configurable for each page template and breakpoint.

    page fold针对每个page template和breakpoint进行配置。

    The page fold configuration is only an indication to speed up the initial creation of page slots that are above the fold.

    You designate the page fold by assigning a page slot to the pageFold parameter.

    将pageSlot赋值给pageFold.

    This page slot, and all previous, sibling page slots, are “above the fold”.

    位于pageFold属性指定的slot以及其之前的兄弟page slot,称之为above the fold.

    These page slots are prioritized ahead of page slots that are “below the fold”.

    All page slots are eventually rendered if they happen to be above the fold.

    The page fold indicates the last page slot that should be rendered above the fold.

    Page fold代表应该以above the fold方式渲染的page slots中的最后一个。

    If you need a configuration for specific breakpoints, you can configure the page fold for every breakpoint, as shown in the following example:

    The page slots adjust their height automatically when components are loaded.

    Page slot的高度是自适应的。

    Given that content can be added at runtime, it is not possible to implement a (hard-coded) minimum height for page slots or components – it all depends on what the business will add at runtime.

    不可能为page slot或者Component设置一个默认的最小高度。

    To make it possible to defer the loading of below-the-fold content, Spartacus marks page slots that are below the page fold while page slots above the fold are being loaded. All page slots are marked with an is-pending class as long as all the inner components are not loaded.

    当above the fold的page slot被加载时,below the fold中的slots被打上标记:如果其inner Components尚未被加载,则使用is-pending class来标注。

    Additionally, the page fold slot has a page-fold class. With these two classes, Spartacus can apply various CSS rules to control deferred loading of below-the-fold content.

    更多Jerry的原创文章,尽在:"汪子熙":


    相关文章

      网友评论

        本文标题:SAP Spartacus pagefold学习笔记

        本文链接:https://www.haomeiwen.com/subject/kuthbktx.html