美文网首页
Razor Page简单分页控件

Razor Page简单分页控件

作者: 寻找无名的特质 | 来源:发表于2021-10-12 05:42 被阅读0次

    最近使用Razor Page显示产品列表,编写了一个简单的分页控件,代码如下:

               <nav aria-label="Page navigation example" class="mt-2">
                    <ul class="pagination">
                        @if (Model.CurrentPage > 1)
                        {
                            <li class="page-item"><a class="page-link" href="/Products/currentpage/@(Model.CurrentPage-1)">Previous</a></li>
                        }
    
                        @for (var i = 1; i <= Model.PageCount; i++)
                        {
                            var act = "";
                            if (i == Model.CurrentPage) act = "active";
                            <li class="page-item @act "><a class="page-link" href="/Products/currentpage/@i">@i</a></li>
                        }
                        @if (Model.CurrentPage < Model.PageCount)
                        {
                            <li class="page-item"><a class="page-link" href="/Products/currentpage/@(Model.CurrentPage+1)">Next</a></li>
                        }
    
                    </ul>
                </nav>
    

    这段代码基于BootStrap,需要在Razor 页面模型中定义两个变量,CurrentPage(当前页)和PageCount(总页数),在OnGet获取列表数据时设置这两个变量。使用这个控件换页时实际上是将当前页面作为URL参数重新加载页面。

    相关文章

      网友评论

          本文标题:Razor Page简单分页控件

          本文链接:https://www.haomeiwen.com/subject/mxiqoltx.html