amp-user-notification中的amp-img不会在页面加载中显示

时间:2019-01-18 09:15:32

标签: amp-html amp-img

我正在尝试将图标添加到amp-user-notification组件中。但是,在页面加载时,不会显示amp-img。如果我向下滚动页面并刷新,则会加载图像。如果我向下滚动然后调整屏幕大小,也会发生这种情况。

我将amp-user-notification的布局类型更改为“ response”,但验证失败(由于不是可接受的类型)。

<amp-user-notification layout="nodisplay" id="event-bank-holiday" data-show-if-href="api/contactandhelp/get/event-bank-holiday" data-dismiss-href="api/contactandhelp/set/event-bank-holiday" data-persist-dismissal="false" class="alert theme--purple i-amphtml-element i-amphtml-layout-nodisplay amp-active" role="alert" i-amphtml-fixedid="F2" style="">
    <div>
        <span class="alert__icon">
            <span class="alert__icon__inner">
                <amp-img src="-/prefix/media/icons/alert-icons/bank-holiday.svg?h=40&amp;w=40&amp;hash=E3BFFD6190E698681D14FD8A35A0EE011B730964" width="40" height="40" alt="bank holiday icon" layout="responsive" class="i-amphtml-element i-amphtml-layout-responsive i-amphtml-layout-size-defined">
                    <i-amphtml-sizer style="padding-top: 100%;"></i-amphtml-sizer>
                 </amp-img>
             </span>
          </span>
     </div>
</amp-user-notification>

前端渲染之前的代码

<amp-user-notification 
    layout="nodisplay"
    id="event-bank-holiday"
    data-show-if-href="https://[...]/api/contactandhelp/get/event-bank-holiday"
    data-dismiss-href="https://[...]/api/contactandhelp/set/event-bank-holiday"
    data-persist-dismissal="false" class="alert theme--purple">
    <div>
        <span class="alert__icon">
            <span class="alert__icon__inner">
                <amp-img src="-/prefix/media/icons/alert-icons/bank-holiday-white.svg?h=40&amp;w=40&amp;hash=E3BFFD6190E698681D14FD8A35A0EE011B730964" width="40" height="40" alt="bank holiday icon" layout="intrinsic" />
            </span>
        </span>
    </div>
</amp-user-notification>

0 个答案:

没有答案