amp-live-list
简介
amp-live-list 组件添加了对将实时更新发布到 AMP 页面的支持，以便在源文档中提供新内容。这非常适合实现实时博客。在此处查找实时博客的示例：此处。
换句话说，AMP 运行时将轮询服务器以获取对原始文档的更新，从而自行获取。服务器可以返回整个 AMP 页面 或其部分，运行时会无缝地就地更新页面。
设置
在标题中导入 amp-live-list 组件。
<script async custom-element="amp-live-list" src="https://cdn.ampproject.org/v0/amp-live-list-0.1.js"></script>
用户交互后更新：实时博客
使用 data-poll-interval 属性指定 amp-live-list 组件轮询新数据的频率。最小间隔为 15 秒。使用 data-max-items-per-page 指定页面上显示的最大数量。有关所有属性的详细说明，请参阅 amp-live-list。
使用 on="tap:my-live-list.update" 从服务器加载最新更改。当 AMP 运行时发现新的文档更改时，会出现一个按钮。请注意，该按钮必须定义为 amp-live-list 的直接子元素。
amp-live-list 必须包含 <div items> 下的项目列表。每个项目都有一个特定的 ID，并且 amp-live-list 将查找具有新 ID 的项目。
通过单击“您有更新”按钮，新内容将显示在演示列中（如果通过桌面访问演示，则在右侧）。代码列（如果通过桌面访问演示，则在中心）不会自行更新，但是如果要查看页面上的所有项目，请重新加载页面。
<amp-live-list layout="container" data-poll-interval="15000" data-max-items-per-page="5" id="amp-live-list-insert-blog">
<button update on="tap:amp-live-list-insert-blog.update">You have updates</button>
<div items>
</div>
</amp-live-list>
amp-live-list 的内容是随机生成的（为了更容易和可重复的测试）。自动更新
如果要更新现有列表项而无需用户交互，则需要通过 data-update-time 属性指定执行更新的时间。以下示例将显示并自动更新当前时间。此方法非常适合显示实时比分或实时市场价值。
时间是：
<amp-live-list layout="container" data-poll-interval="15000" data-max-items-per-page="1" id="amp-live-list-update">
<button update on="tap:amp-live-list-insert-blog.update">You have updates</button>
<div items>
<div id="time" data-sort-time="1234567" data-update-time="" class="time">
The time is: <time></time>
</div>
</div>
</amp-live-list>
需要进一步的解释吗？
如果此页面上的解释没有涵盖您的所有问题，请随时联系其他 AMP 用户以讨论您的具体用例。
转到 Stack Overflow 一个无法解释的功能？AMP 项目强烈鼓励您的参与和贡献！我们希望您能成为我们开源社区的长期参与者，但我们也欢迎您为自己特别感兴趣的问题做出一次性贡献。
在 GitHub 上编辑示例