正文
C# Web分页功能实现
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
无论是网站还是APP分页功能都是必不可少的。为什么使用分页呢?
1，加载速度快，不会占用服务器太多资源，减少服务器压力。
2，减少数据库压力。
3，提升用户体验。
那么我们常用的分页方法有两种。
1，真分页：每页都会从数据库读取少量数据，优点就是读取数据量少，性能非常好，大型网站往往采用这种方式。
2，假分页：从数据库一次性读取大量数据，但由于数据量比较大，导致响应时间长，但是之后的每一页都是快速显示，避免多次访问数据库。
我们常用的就是数据库分页（真分页）。下面看是如何实现的。
先定义存储过程
CREATE PROC DataUser
@Page int,
@intPagenum int,
@Total int output
as
DECLARE
@startIndex int,
@endIndex int;
set @startIndex=(@Page-1)*@intPagenum+1;
set @endIndex=@Page*@intPagenum;
begin
select @Total=COUNT(1) from Blogs_User
select OpenId,UserName,Href_Img,CONVERT(varchar(20),Addtime,20) as Addtime from (select *,ROW_NUMBER() over(order by Addtime desc) as tableId from Blogs_User) tableuser where tableId>=@startIndex and tableId<=@endIndex
end
现在我们封装执行存储过程的方法
/// <summary>
/// 执行存储过程，返回DataTable和总记录条数
/// </summary>
/// <param name="page">页码</param>
/// <param name="intPagenum">每页数量</param>
/// <returns></returns>
public static JsonDataTable GetUserDataDao(int page, int intPagenum)
{
try
{
DataSet ds = new DataSet();
JsonDataTable result = new JsonDataTable();
using (SqlConnection conn = new SqlConnection(Getconnection()))
{
using (SqlCommand cmd = conn.CreateCommand())
{
cmd.CommandText = "DataUser";//存储过程名称
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.Add(new SqlParameter("@Page", SqlDbType.Int));//入参
cmd.Parameters.Add(new SqlParameter("@intPagenum", SqlDbType.Int));//入参
cmd.Parameters["@Page"].Value = page;
cmd.Parameters["@intPagenum"].Value = intPagenum;
SqlParameter parameter = cmd.Parameters.Add("@Total", SqlDbType.Int);
parameter.Direction = ParameterDirection.Output;
if (conn.State == ConnectionState.Closed)
{
conn.Open();
}
SqlDataAdapter my = new SqlDataAdapter(cmd);
my.Fill(ds);
result.dt = ds.Tables[];
result.Total = Convert.ToInt32(cmd.Parameters["@Total"].Value);
conn.Close();
return result;
}
}
}
catch (Exception e)
{
ErrorLog.Write("后台获取用户列表异常", e);
return null;
}
}
封装读取数据接口
[HttpPost]
public JsonResult GetUserList(int page, int intPagenum)
{
JsonDataTable result = Blogs_UserDao.GetUserDataDao(page, intPagenum);
if (result != null && result.dt != null && result.dt.Rows.Count > )
{
result.JsonData = JsonHelper.JsonDataTable(result.dt);
result.dt = null;
return BaseJsonResult.GetInstance().CreateJsonGetResult(true, "成功!", result);
}
return BaseJsonResult.GetInstance().CreateJsonGetResult(false, "失败,没有数据!", null);
}
后台分页就已经完成了。
前端JS调用，有分页的UI组件，也可以自己做成“加载更多”分页方式，使用ajax调用接口异步加载数据。
//加载更多点击事件 Dataloading() {
this.Page++;//当前页码
$.post("/M_BlogsAPI/GetNewShare", { page: this.Page, ShareTypeId: 0, Pagesize: this.Pagesize }, function (data) {
if (data.Result) {
var AddNewShare = JSON.parse(data.Data.NewShareJson);
for (var i = 0; i < AddNewShare.length; i++) {
app.Blogs_NewShare.push(AddNewShare[i]);
}
}
});
}
这里我使用的VUE。先默认Page=1，点击加载更多时，Page+1，再调用接口读取当前页面的数据再循环添加到数组里面。效果看博客留言或者短视频页面。
本文来自：C# Web分页功能实现 | 小曾博客
