如何实现内容分页展示?

在这个例子中,我们将会把一个名单分为多个页面。最终的效果如下图,名单被分为每三个名字一页,点击下面的页码可以跳转到相应的页面。

首先,我们需要创建一个名单。在导航菜单上点击内容-内容,新建一个叫做list的数据类型,其中含有一个叫做‘name’的文本框字段,接着建立如下名单。

建立一个组件,输入以下HTML代码创建一个模板开显示名字和页码。

现在我们将把这个模板变成动态的。首先我们需要添加数据源。把数据源设置为ContentList – ByFolder,因为我们需要从名单中获取所有的名字,记得修改数据源的别名。

选择刚创建的名单作为文件夹,点击配置来设置具体的信息。PageSize是让你设置一页需要显示多少条记录的。在这个例子中我们将其设置为3,你可以设置任何你想要的数值。其他设置使用默认的值即可。

选择显示名字的<h2>标签,建立一个循环项。将数据源设置为Name_list。

将数据绑定到<h2>标签。

选择显示页码的<li>标签并将其循环显示页码。

下一步,确保你选中了<li>标签下的<a>标签。

将数据绑定到<a>标签。

现在我们将设置页码的链接,这样当我们点击页码后页码将会跳转到相应的页码。选择<a>标签并点击链接按键,系统将会自动识别这是一个页码链接,所以不需要更改任何设置,直接点击保存即可。

创建一个空白的布局,你可以在之后添加样式和脚本。

使用这个布局建立一个新的页码,把刚才创建的组件添加到这个页码中。

现在预览这个页码,你可以看到分页的效果已经完成了。