koa框架中使用ejs
1.安装koa和koa-views
npm install --save-dev koa koa-views / cnpm install --save-dev koa koa-views
2.安装ejs
npm install ejs --save / cnpm install ejs --save
3.引入koa-views配置中间件
const views = require('koa-views');
app.use(views('views', {
map: {
html: 'ejs' }}));
// 配置模板引擎中间件 -- 第三方中间件
app.use(views('views', {
extension: 'ejs' /*应用ejs模板引擎 模板的后缀名是 .ejs*/
}))
// 这样配置也可以 注意如果这样配置的话 模板的后缀名是 .html
// app.use(views('views', { map: { html: 'ejs' } }));
4.app.js文件
const koa=require("koa");
const app=new koa();
const views = require('koa-views');
//require("koa-router") 返回的是函数 执行之后返回对象
const router=require("koa-router")();
// 配置模板引擎中间件 -- 第三方中间件
app.use(views('views', {
extension: 'ejs' /*应用ejs模板引擎 模板的后缀名是 .ejs*/
}))
// 这样配置也可以 注意如果这样配置的话 模板的后缀名是 .html
// app.use(views('views', { map: { html: 'ejs' } }));
router.get('/add', async (ctx) => {
let arr=['1','2','3'];
await ctx.render('index',{
list:arr});
})
//路由和koa框架关联
app.use(router.routes());
let port=8000;
let host='localhost'
//端口监听
app.listen(port,host,()=>{
console.log(`http://${host}:${port}`);
});
5.index.ejs文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
li{
list-style:none;
}
</style>
<body>
<ul>
<%for(var i=0;i<=list.length;i++){
%>
<li><%= list[i]%></li>
<%}%>
</ul>
</body>
</html>
文件目录：
最终界面显示结果：
