amp-next-page
简介
amp-next-page 允许您在 AMP 页面中添加无限滚动式的体验。
设置
导入 amp-next-page 组件。
<script async custom-element="amp-next-page" src="https://cdn.ampproject.org/v0/amp-next-page-1.0.js"></script>
基本用法
此示例使用 amp-next-page 组件加载其他示例页面。它定义了一个自定义分隔符。
<amp-next-page>
<script type="application/json">
[
{
"title": "amp-img",
"image": "https://preview.amp.dev/static/samples/img/amp.jpg",
"url": "/documentation/examples/components/amp-img/"
},
{
"title": "amp-bind",
"image": "https://preview.amp.dev/static/samples/img/amp.jpg",
"url": "/documentation/examples/components/amp-bind/"
},
{
"title": "amp-accordion",
"image": "https://preview.amp.dev/static/samples/img/amp.jpg",
"url": "/documentation/examples/components/amp-accordion/"
},
{
"title": "amp-lightbox-gallery",
"image": "https://preview.amp.dev/static/samples/img/amp.jpg",
"url": "/documentation/examples/components/amp-lightbox-gallery/"
},
{
"title": "amp-list",
"image": "https://preview.amp.dev/static/samples/img/amp.jpg",
"url": "/documentation/examples/components/amp-list/"
}
]
</script>
<div class="amp-next-page-sample-separator" separator>
amp-next-page separator
</div>
</amp-next-page>
需要进一步解释吗？
如果本页的解释未能涵盖您的所有问题，请随时与其他 AMP 用户交流，讨论您的具体用例。
前往 Stack Overflow 一个未解释的功能？AMP 项目强烈鼓励您的参与和贡献！ 我们希望您成为我们开源社区的长期参与者，但也欢迎您为自己特别感兴趣的问题做出一次性贡献。
在 GitHub 上编辑示例