用户登录

Layouts,布局。就是在视图里面可以重复使用的页面的模板 .. 布局也是普通的视图文件,只不过你在布局里面可以定义 section,就是区域 .. 这些区域里的具体内容,你可以在使用这个布局的视图里面去定义 ..

先创建一个布局 .. 可以放在 resources .. views 的下面,新建一个目录,名字是 laytous .. 布局文件的名字是 main.edge ..

在这个布局文件里,先添加一个基本的 html 文档的结构 .. 每个页面都需要用到这样的结构 .. 安装了 Emmet 插件以后,可能这样 .. 输入一个 ! 号,按一下 tab 键,或者 Emmet 展开缩写用的专用的快捷键,这样就可以得到一个基本的 html 文档的结构 ..

记不住这个快捷键 .. 可以打开命令面板 .. 搜索一下 emmet abbr .. 这里会显示展开缩写用的快捷键是什么 ..

下面再改造一下这个布局视图 ..

title 标签里的东西是页面的标题 .. 可以绑定一个 pageTitle .. 再添加一个默认的值 .. ninghao .. 这样如果视图里面没有 pageTitle 这个数据,就会使用这个默认的值作为页面的标题 ..

@layout

现在我们就可以去使用一下这个布局 .. 在这个 index.edge 这里,先剪切一下这个视图里的内容 .. 现在我打算在这个视图里面用一下刚才定义的那个 Layout .

用一个 @layout .. 然后设置一下要使用的布局的名字 .. 这里就是 laytous 目录下面的 main 这个布局 ..

在浏览器上访问一下 posts 这个地址 .. 现在页面就使用了 layouts 里的 main 这个布局 .. 查看一下页面的源代码 ..

这里的代码结构跟在 main 这个布局里的定义是一样的 .. 现在这个标题内容里面包含 html 标签 .. 可以去掉它 .. 在 PostController 这里,修改一下传递的 postTitle 的值 .. 去掉它里面的 html 标签 ..

布局:Layouts《 Node.js 应用:视图 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点