这节课讨论局部视图(partial view)。
在不同的页面之间可能会有相同的内容，例如导航部分内容。我们可以为每个 ejs 的视图写死导航内容又或者为导航内容创建一个局部视图，每个 ejs 视图只需要引入这个局部视图就可以使用。
这样做有什么好处？
- 首先，不需要重复代码
- 其次，当需要改变代码的时候，不用对逐个视图进行修改，只需要修改局部视图的代码即会影响所有引入该局部视图的视图页。
先来创建局部视图
- 在 views 文件夹里创建局部视图
nav.ejs
‘/partials/nav.ejs’
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/contact">Contact</a></li>
<li><a href="/profile">Profile</a></li>
</ul>
</nav>
- 在视图页面上引入局部视图：通过
<%include %>进行引入
‘profile.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>index</title>
</head>
<body>
<%include partials/nav.ejs %>
<ul>
<% data.hobbie.forEach(function(item)){%>
<li><%= item %></li>
<% });%>
</ul>
</body>
</html>
这样 express 渲染 profile 视图的时候就会将局部视图 nav.ejs 里的内容注入到对应的位置当中。
网友评论