nodejs 服务端渲染
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Documenttitle>
<style>
* {
margin: 0;
padding: 0;
}
table {
width: 100vw;
}
tr {
width: 100%;
display: flex;
}
td,
th {
flex: 1;
text-align: center;
}
style>
head>
<body>
<table border="1" borderSpace="0">
<tr>
<th>编号th>
<th>名称th>
<th>介绍th>
<th>价格th>
<th>数量th>
tr>
{{ each list }}
<tr>
<td>{{ $value.goods_id }}td>
<td>{{ $value.name }}td>
<td>{{ $value.intro }}td>
<td>{{ $value.price }}td>
<td>{{ $value.num }}td>
tr>
{{ /each }}
table>
body>
html>
app.js config
const express = require("express");
const path = require("path");
const fs = require("fs");
const template = require("art-template");
const mysql = require("mysql");
const connection = mysql.createConnection({
host: "localhost",
user: "root",
password: "24118028",
database: "fmg",
});
const app = express();
app.engine("html", require("express-art-template"));
app.set("view engine", "html");
connection.connect();
app.get("/get_goods", async (req, res) => {
connection.query("SELECT * FROM TB_GOODS", (error, results, fields) => {
if (error) {
res.send("error");
}
console.log(results);
res.render("index.html", { list: results });
});
});
app.listen(3000, () => {
console.log("Server is running at localhost:3000");
});
app.json 文件
{ "name": "nodejs-server", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], "author": "", "license": "ISC", "dependencies": { "art-template": "^4.13.2", "express": "^4.17.2", "express-art-template": "^1.0.1", "mysql": "^2.18.1" } }
结果图