pbootcms分页调用

来个示范

<!-- 分页 -->
{pboot:if({page:rows}>0)}
   <nav aria-label="page navigation" class="my-4">
     <div class="pagination justify-content-center">
         <a class="page-item page-link" href="{page:index}">首页</a>
         <a class="page-item page-link" href="{page:pre}">上一页</a>
          {page:numbar}<!-- 数字条,小屏幕时自动隐藏-->
          <a class="page-item page-link" href="{page:next}">下一页</a>
          <a class="page-item page-link" href="{page:last}">尾页</a>
     </div>
   </nav>    
{else}
       <div class="text-center my-5 text-secondary">未查询到任何数据!</div>
{/pboot:if}

分页条标签

适用范围:分页条标签适用所有执行了分页的页面

标签作用:用于输出分页代码

1、分页条标签

{page:bar} 系统内置的完整分页条
{page:current} 当前页码
{page:count} 总页数
{page:rows} 总数据行数
{page:index} 首页链接
{page:pre} 前一页链接
{page:next} 下一页链接
{page:last} 尾页链接
{page:status} 分页状态信息
{page:numbar} 数字条,数字带class名称为page-num,当前的同时还带page-num-current
{page:selectbar} 下拉选择条

2、分页条自带的HTML样式class名称

状态:page-status

首页:page-index

上一页:page-pre

下一页:page-next

尾页:page-last

数字条:page-numbar ,数字条下面的数字:page-num ,如果是当前页,那么该数字还同时带有:page-num-current

下拉条:page-select (默认条已经不显示)

如果使用系统完整分页条,则以上样式名称在输出的HTML代码中都带,你可以直接使用对应名称在自己的css中定义具体样式即可;

如果使用自定义方式,那么就按照自己写的html代码来定义,但是数字条下面的page-num 、page-num-current依然有效。

当然,如果你对前端还算比较上手,你应该知道其实上面说的这些通过F12都可以看到。

© 版权声明
THE END
喜欢就支持一下吧
点赞13
评论 抢沙发

请登录后发表评论

    暂无评论内容