Nodejs：nodeJs+express+ejs+mongoose实现翻页原理1

Nodejs：nodeJs+express+ejs+mongoose实现翻页原理1

网上找了很多类似教程发现无果 故自己大概写了实现原理分为2种方式 一种是AJAX 一种是直接请求 2种方式都有他们的共同点 就是异步

首先是传值请求（路由方式这里不论述 不懂可以看看express教程）

exports.index = function (req, res, next) { var page = req.query.p; var perPage = (req.query.pr)?req.query.pr:3;

db.allTodos(page,perPage,function (err, todos) {
    if (err) {
        return next(err);
    }
	//console.log(todos);
    res.render('index.html', {todos: todos.data,count:todos.count});
});

}; 首先是常规的传值

其中page 是当前页面 perpage 是每一页显示数量 然后调用 岛ALLTODOS 其实就是model

exports.allTodos = function(page,perPage,callback) { //获取总数 Todo.count({}, function (err, count) { //获取列表 Todo.find({}).sort({’_id’:-1}).skip((page-1)*perPage).limit(perPage).exec(function(err,doc){ var d= []; d.data = doc; d.count = count; callback(err,d);

		})
});

} 根据以上代码 我们可以看到真个过程都是异步进行 最后结果我们返回到 index里面

res.render(‘index.html’, {todos: todos.data,count:todos.count}); 然后我们包涵了翻页3个必要参数 包括 page perpage count 这样就可以实现业务逻辑了 …… 详情可以关注我的BLOG enter link description here


3 回复

Node.js: 使用 nodeJs + express + ejs + mongoose 实现翻页原理

在网上查找了许多类似的教程，但都没有找到满意的答案。因此，我决定自己编写一个实现翻页功能的教程，并将其分为两种方式：一种是通过 AJAX 实现，另一种是通过直接请求实现。这两种方式都涉及到异步处理。

直接请求方式

首先，我们来看如何通过直接请求来实现翻页功能。

1. 路由设置

在 Express 中定义路由以处理分页请求：

const express = require('express');
const app = express();
const Todo = require('./models/Todo'); // 假设你的模型文件为 models/Todo.js

app.get('/todos', function(req, res, next) {
    var page = req.query.p || 1; // 当前页，默认为第一页
    var perPage = req.query.pr ? parseInt(req.query.pr) : 3; // 每页条目数，默认为3

    // 调用 allTodos 方法获取数据
    Todo.allTodos(page, perPage, function(err, todos) {
        if (err) {
            return next(err);
        }
        res.render('index.ejs', { todos: todos.data, count: todos.count });
    });
});

module.exports = app;

2. 模型方法

在模型文件中定义 allTodos 方法来获取数据：

const mongoose = require('mongoose');

const TodoSchema = new mongoose.Schema({
    // 定义你的模型字段
});

const Todo = mongoose.model('Todo', TodoSchema);

TodoSchema.statics.allTodos = function(page, perPage, callback) {
    // 获取总数
    Todo.count({}, function(err, count) {
        if (err) return callback(err);

        // 获取列表
        Todo.find({})
            .sort({ _id: -1 }) // 按照_id降序排列
            .skip((page - 1) * perPage) // 跳过前面的条目
            .limit(perPage) // 只取指定数量的条目
            .exec(function(err, docs) {
                if (err) return callback(err);

                var data = {
                    data: docs,
                    count: count
                };
                callback(null, data);
            });
    });
};

module.exports = mongoose.model('Todo', TodoSchema);

3. 视图渲染

在 EJS 模板中渲染数据，并添加分页链接：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Todos List</title>
</head>
<body>
    <h1>Todos List</h1>
    <ul>
        <% todos.forEach(function(todo) { %>
            <li><%= todo.name %></li>
        <% }) %>
    </ul>

    <!-- 分页链接 -->
    <div>
        <% for (let i = 1; i <= Math.ceil(count / perPage); i++) { %>
            <a href="/todos?p=<%= i %>&pr=<%= perPage %>"><%= i %></a>
        <% } %>
    </div>
</body>
</html>

总结

通过上述代码，我们可以看到整个过程都是异步进行的。最后的结果被返回到 index.ejs 页面中进行渲染。我们还包含了翻页所需的三个必要参数：page、perPage 和 count，这样就可以实现翻页功能了。

如果你需要更详细的说明或有其他问题，请随时留言。


用skip就算了吧

根据提供的代码片段和描述，我们可以使用 Node.js、Express、EJS 和 Mongoose 实现一个基本的分页功能。下面是具体的实现方法：

示例代码

首先，定义路由处理函数来处理请求，并从数据库中获取数据。

const express = require('express');
const mongoose = require('mongoose');
const Todo = require('./models/Todo'); // 假设这是你的模型

const app = express();

app.set('view engine', 'ejs');

app.get('/todos', (req, res, next) => {
  let page = parseInt(req.query.p) || 1; // 当前页，默认为第一页
  const perPage = parseInt(req.query.pr) || 3; // 每页条目数，默认为3

  const startIndex = (page - 1) * perPage;
  const endIndex = page * perPage;

  Todo.countDocuments().then(totalCount => {
    Todo.find()
      .sort({ _id: -1 })
      .skip(startIndex)
      .limit(perPage)
      .then(todos => {
        res.render('index', { todos, currentPage: page, totalPages: Math.ceil(totalCount / perPage) });
      })
      .catch(next);
  }).catch(next);
});

// 配置 EJS 模板引擎
app.use(express.static('public'));

// 启动服务器
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => console.log(`Server running on port ${PORT}`));

EJS 模板

接下来，创建一个简单的 EJS 模板文件 views/index.ejs 来展示分页信息：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Todos List</title>
</head>
<body>
  <h1>Todo List</h1>
  <ul>
    <% todos.forEach(todo => { %>
      <li><%= todo.title %></li>
    <% }) %>
  </ul>

  <div>
    <% for (let i = 1; i <= totalPages; i++) { %>
      <a href="/todos?p=<%= i %>&pr=<%= perPage %>"><%= i %></a>
    <% } %>
  </div>
</body>
</html>

解释

  • 路由处理：通过查询参数 p 获取当前页数，pr 获取每页条目数。默认情况下，如果这些参数不存在，则分别设置为 1 和 3。
  • 数据查询：使用 Todo.countDocuments() 获取总记录数，再通过 Todo.find() 获取当前页的数据。
  • 分页链接：在 EJS 模板中，生成所有页码的链接，用户可以通过点击不同的页码跳转到相应的页面。

这样就完成了一个简单的分页功能。你可以根据需要调整样式和逻辑以适应具体的应用场景。

回到顶部