使用nodeJs上的res.render将多个数据数组传递给视图

在Node.js中，使用Express框架时，res.render方法用于将数据发送到客户端并渲染一个视图模板。当你需要传递多个数据数组给视图时，可以将这些数据作为对象的属性传递给res.render方法。

基础概念

Express: 一个简洁而灵活的Node.js Web应用程序框架，提供了一系列强大的特性来帮助你创建各种Web和移动设备应用。
res.render: Express中的一个方法，用于渲染视图模板并将数据传递给该模板。

优势

模块化: 可以将数据和逻辑分离，使得代码更加清晰和易于维护。
灵活性: 可以根据需要传递任意数量的数据对象到视图模板。
可扩展性: 随着应用的增长，可以轻松添加更多的数据源和逻辑处理。

类型

局部变量: 在模板中可以直接访问传递的数据。
全局变量: 如果需要在多个视图中使用相同的数据，可以设置全局变量。

应用场景

动态内容展示: 如电商网站的产品列表和分类。
用户个性化体验: 如根据用户登录状态显示不同的内容。
数据分析报告: 如将多个数据集合并展示在一张图表中。

示例代码

假设我们有一个Express应用，并且我们想要渲染一个名为index.ejs的视图，同时传递两个数组users和posts。

const express = require('express');
const app = express();

app.set('view engine', 'ejs'); // 设置视图引擎为EJS

app.get('/', (req, res) => {
    const users = [
        { id: 1, name: 'Alice' },
        { id: 2, name: 'Bob' }
    ];

    const posts = [
        { id: 1, title: 'First Post', content: 'This is the first post.' },
        { id: 2, title: 'Second Post', content: 'This is the second post.' }
    ];

    res.render('index', { users, posts }); // 将数据传递给视图
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

在views/index.ejs文件中，你可以这样访问这些数据：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Data Example</title>
</head>
<body>
    <h1>Users</h1>
    <ul>
        <% users.forEach(user => { %>
            <li><%= user.name %></li>
        <% }) %>
    </ul>

    <h1>Posts</h1>
    <ul>
        <% posts.forEach(post => { %>
            <li><%= post.title %> - <%= post.content %></li>
        <% }) %>
    </ul>
</body>
</html>