Vue.js实现分页查询功能

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

vue.js的使用如下：

1、引入vue.js

rush:js;">

2、分页的方法

rush:java;"> public JsonResult GrtUserData(int page,int rows) { //top分页法 row_number分页 TextEntities tes = new TextEntities(); //分页查询 List ulist = tes.Users.OrderBy(a=>a.Id).Skip((page-1)*rows).Take(rows).ToList(); int allcount = tes.Users.Count(); //总页数 int allpage = allcount / rows; if (allcount % rows !=0)

allpage = allpage + 1;
DTO_Page dp = new DTO_Page();
dp.data = ulist;
dp.allpage = allpage;
return Json(dp,JsonRequestBehavior.AllowGet);
}

3、封装page方法

rush:java;"> public class DTO_Page { public int rows { get; set; } public int allpage { get; set; } public List data { get; set; } }

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

rush:java;"> public JsonResult GetAllpage(int rows) { TextEntities tes = new TextEntities(); int allcount = tes.Users.Count(); //总页数 int allpage = allcount / rows; if (allcount % rows != 0) allpage = allpage + 1; return Json(allpage);

}

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

rush:js;">

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

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