Koa koa-views

koa-views

koa-views 是一个视图管理模块,它的灵活度很高,支持很多的模版引擎,这里我们给它配置的引擎是 ejs

运行 npm i koa-views & npm i egg.js

const views = require('koa-views')
const path = require('path')

// 配置视图
app.use(views(path.join(__dirname, './views'), {
    extension: 'ejs'
}))

我们新建一个 views 目录,这里面存放我们的视图文件,在新建一个 index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>ejs</title>
</head>
<body>

<%=message%> <!-- ejs 的模版语法,读取变量 message | 是从 render 传递过来 -->

</body>
</html>

app.js

app.use(async (ctx, next) => {
  await ctx.render('index', {message: 'index'}) // render 渲染方法,这里加载到 views/index.ejs 文件 | 第二参数是传参到模版
  await next()
})

ejs

ejs 是一个非常简洁的 JavaScript 模版引擎,使用起来也很简单。

/*
 读取变量
*/
<%=%> 

/*
 控制流程,循环操作
*/
<%%> 

// 例子
<% if (arr) {%>
 <% arr.forEach((element) => { %>
  <%=element%>
 <%})%>
<%}%>

/*
  引入文件
*/
<% include file %>
Koa 教程 Koa 入门 Koa HTTP Koa 开发框架 Koa 路由 Koa 静态文件 Koa bodyparser Koa 视图 Koa 数据库 Koa 记录日志