koa test3 ejs模板引擎 views渲染
阿新 • • 發佈:2018-12-21
安裝
npm install koa-views --save
npm install ejs --save
匯入
const views = require('koa-views');
配置
配置模板引擎中介軟體 --- 第三方中介軟體
一、全域性變數
app.use(async (ctx,next){
await ctx.sate.g:'這是一個全域性變數'
netx()
})
兩種配置方式 不同的方式需要的檔案的字尾名不同
1.字尾名為ejs 的中介軟體
app.use(views,('views',{
extension:'ejs'
}))
2.字尾名為html
app.use(views,(mpa{html:'ejs'))
渲染
ruoter.get('/', async ctx=>{ await ctx.render ('index',{ title:'hollew word', list:[123,123,123,123,123,], htmlH:'<h3>這是一個H3</>', num:12 }) })
建立dom模板
1.建立元件(建立一個公共的元件模板)
<h1>這是首頁</h1>
2.建立網頁
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!--引入模板--> <% include ../public/hader.ejs %> <!-- 渲染資料--> <p> 這是title: <%=title%> </p> <!--渲染帶有html資料--> <%-htmlH%> <!--迴圈資料--> <ul> <%for(var i=0;i<list.length;i++){%> <li><%=list[i]%></li> <%}%> </ul> <!--判斷語句--> <%if(num>10){ %> 大於<%=num%> <%}else{%> 小於<%=num%> <%}%> <!--引入全域性資料--> <%=g%> </body> </html>