课程信息
课程名称: Node.js+Express+Koa2+开发Web Server博客
课程章节: 第6章 博客项目之登录
课程讲师: 双越
课堂笔记
1、变量和判断
1.变量
ejs:nodejs服务端的模板引擎,也就是SSR,由服务端渲染。
变量:<%= title %>
/src/views/index.ejs:
// 这里是从路由那边传递过来的
<%= title %>
EJS Welcome to <%= title %>
<%= msg %>
// 不确定哪个变量是否传过来,可以前面加个locals. 如果不加的话,那么会报错
<%= locals.name %>
/src/routes/index.js:
router.get('/', async (ctx, next) => {
await ctx.render('index', {
title: 'Hello Koa 2!',
msg: "你好"
})
})
2.判断
/src/views/index.ejs:
<% if (isMe) { %>
[@ 提到我的(3)](#)
<% } else { %>
关注
<% } %>
/src/routes/index.js:
router.get('/', async (ctx, next) => {
// 读取模板文件是异步的,所以要用await
await ctx.render('index', {
title: 'Hello Koa 2!',
msg: "你好",
isMe: true
})
})
2、循环和组件
1.组件
新建/views/widgets文件夹,用来专门存放小组件。
views/widgets/user-info.ejs:
<% if (isMe) { %>
[@ 提到我的(3)](#)
<% } else { %>
关注
<% } %>
views/index.ejs:
<%- include("widgets/user-info",{
isMe
})%>
2.循环
views/widgets/blog-list.ejs:
<% blogList.forEach(blog=>{ %>
<%= blog.title %>
<% }) %>
routes/index.js:
router.get('/', async (ctx, next) => {
await ctx.render('index', {
title: 'Hello Koa 2!',
msg: "你好",
isMe: true,
blogList: [
{
id: 1,
title:"aaa"
},
{
id: 2,
title: "bbb"
},
{
id: 3,
title:"ccc"
}
]
})
})
views/index.ejs:
<%- include("widgets/blog-list",{
blogList
})%>