关于vue3:Vue3Nuxt3打造SSR网站应用0到1实现服务端渲染MKW

1.分页次要字段

download : https://www.97yrbl.com/t-1376.html

分页次要字段包含 pageSize 每页条数、pageNum 第几页、startRow 以后开始页编号、endRow 以后完结页编号、total 总数量。次要是依据前端分页的参数，进行解决后，返回前端正确的数据，其实是一个很常见且简略的性能。然而是十分也是十分重要的。

pageSize 每页条数
pageNum  第几页
startRow 以后开始页编号
endRow 以后完结页编号
total 总数量
计算 3.startRow 和 endRow
封装成一个函数

/* 分页公共函数*/
module.exports = handlePages = (pageNum, pageSize, total) => {
    let startRow = total > 0 ? ((pageNum - 1) * pageSize + 1) : 0;
    let endRow = pageNum * pageSize <= total ? pageNum * pageSize : total;
    return {
        pageNum,
        pageSize,
        recordCounts:total,
        startRow,
        endRow
    }
}

2.接口函数中应用该函数

从前端传参中获取，分页所须要的数据。

 let { nickname, name, role, pageSize, pageNum } = ctx.request.body;
 
 //此处进行解决
 let pageNum1 = (pageNum - 1) * pageSize
//获取用户信息列表
async getAllUserList(ctx) {
   let { nickname, name, role, pageSize, pageNum } = ctx.request.body
   let res = []
   let pageNum1 = (pageNum - 1) * pageSize
   let total = (await User.getAllUserListTotal())[0].recordCounts
   if (!nickname && !name && !role) {
     res = (await User.getAllUserListNotCond(pageSize, pageNum1))
   } else {
     res = (await User.getAllUserList(nickname, name, role, pageSize, pageNum1))
   }
   ctx.body = {
     code: 0,
     data: res.map(v => {
       if (v.password) {
         delete v.password
       }
       return v
     }),
     //分页所有的参数
     ...handlePages(pageNum, pageSize, total)
   }
 }

3.分页中的MySql语句

依据分页查询数据库的数据
//依据分页查问用户列表
async getAllUserListNotCond(pageSize, pageNum) {
        return await query(`SELECT * FROM user LIMIT ${pageNum},${pageSize}`)
}
mySql获取数据库数据总条数
//获取用户信息列表的总条数
async getAllUserListTotal() {
   return await query(`SELECT COUNT(*) as recordCounts FROM user`)
}