微客导航 » 文章资讯 » Vue.js实现分页查询功能

Vue.js实现分页查询功能

2023-09-20 09:58:05 399

本文实例为大家分享了Vue.js实现分页查询的具体代码，供大家参考，具体内容如下

vue.js的使用如下：

1、引入vue.js

a、分页条

b、分页条js、css

2、分页的方法

publicJsonResultGrtUserData(intpage,introws)
{
//top分页法row_number分页
TextEntitiestes=newTextEntities();
//分页查询
Listulist=tes.Users.OrderBy(a=>a.Id).Skip((page-1)*rows).Take(rows).ToList();
intallcount=tes.Users.Count();//总页数
intallpage=allcount/rows;
if(allcount%rows!=0)

allpage=allpage+1;
DTO_Pagedp=newDTO_Page();
dp.data=ulist;
dp.allpage=allpage;
returnJson(dp,JsonRequestBehavior.AllowGet);
}

3、封装page方法

publicclassDTO_Page
{
publicintrows{get;set;}
publicintallpage{get;set;}
publicListdata{get;set;}
}

4、定义获取总页数的方法

publicJsonResultGetAllpage(introws)
{
TextEntitiestes=newTextEntities();
intallcount=tes.Users.Count();//总页数
intallpage=allcount/rows;
if(allcount%rows!=0)
allpage=allpage+1;
returnJson(allpage);

}

5、前台分页方法，获取后台的数据，实现分页的动态性

关于vue.js的学习教程，请大家点击专题vue.js组件学习教程、Vue.js前端组件学习教程进行学习。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

返回顶部
3162201930
czq8825@qq.com

Vue.js实现分页查询功能

热门推荐

随机推荐