KOA 中的 ejs

周大胖子

KOA的使用相对express 略有不同：第一步安装： koa -views   、   ejs

1. cnpm install koa-views --save
2. cnpm install ejs --save

复制代码

第二步配置中间件： 两种配置方式 区别在于 引用模板的后缀名不同：

1. const views = require('koa-views'); //引入

复制代码

1. app.use(views('views',{extension:'ejs' }))// 表示应用.ejs模板

复制代码

第三步使用 ： ctx.render   【就相当于express 的  res.render()】

1. router.get('/login', async (ctx,next)=>{
2.       let title = '这是一个菇凉'
3.       await ctx.render('public/login',{
4.                  title
5.       })
6.       await next();
7. })

复制代码

重点：数据在路由间的共享1、第一步：将 公共数据 写入一个中间件。

1. // 配置公共的数据 每一个路由都可以渲染的数据
2. app.use(async (ctx,next)=>{
3.      ctx.state = {
4.          session:this.session,
5.          title2:'这是一个大BOSS'
6.      }
7.      await next()
8. })

复制代码

2.在 ejs模板中，直接调用：   【不需要再在路由中再传一遍。不需要！不需要！不需要！ 再传回报错。】

1. <h1> <%=title2 %> <h1>

复制代码

周大胖子

koa中配置EJS的两种方法：第一种：

1. app.use(views('views',{map:{html:'ejs'}}));  //这是一种使用.html模板

复制代码

第二种：

1. app.use(views('views',{extension:'ejs' }))// 表示应用.ejs模板

复制代码

.ejs文件目录在：  view/public/login.ejs      => app.js  与 view同级

周大胖子

EJS 的常用语法：

1. <%- include header.ejs %>    // 用来引入 html 模板

复制代码

1. <%=title%> //普通的绑定数据

复制代码

1. <%- tttttt%>  //用来接收 html 数据

复制代码

1. <% if(true){ %>     //IF语句
2.     <div>true</div>
3. <%}else{%>
4.     <div>false</div>
5. <%} %>

复制代码

1. <%for (var i=0;i<list.length;i++){ %>
2.     <li><%=list[i] %> </li>
3. <%} %>  //循环

复制代码