Egg 中级
中级架构图
模板引擎
egg 能用的模板引擎有很多,在这里我用的是 egg-view-ejs
安装
bash
npm i egg-view-ejs -S
配置
js
// config/plugin.js
exports.ejs = {
enable: true,
package: "egg-view-ejs",
};
js
// config/config.default.js
exports.view = {
mapping: {
".html": "ejs",
},
};
使用
- 路由
js
// 渲染页面
router.get("/render", controller.render.index);
- 控制器
新建一个 controller/render.js 控制器
js
const { Controller } = require("egg");
class RenderController extends Controller {
async index() {
const { ctx, app } = this;
await ctx.render("demo.html", {
title: "测试页面",
list: ["新闻1", "新闻2", "新闻3"],
});
}
}
module.exports = RenderController;
- 视图
新建 app/view/demo.html 文件
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><%=title%></title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</head>
<body>
<ul>
<% for(var i=0;i<list.length;i++){ %>
<li>
<%=list[i]%>
</li>
<%}%>
</ul>
</body>
<script>
</script>
</html>
</script>
</html>