layout:布局

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

layout 就是页面的整体的布局 .. 现在访问 photos 这个地址,显示了一个 photos ,内容是 index.html.erb 这个模板文件提供的 ...

查看一下页面的源代码 ... 你会发现一些额外的 html 的标签 ... 文档的声明, html,head ,title ,一些 meta 标签,还链接了样式表跟脚本 ..

这些东西都是来自默认的布局 .. 是在 app/views/layouts 这个目录的下面,application.html.erb 就是默认的布局 .. 其实它是 application_controller 使用的布局 ...

不过一般的控制器都会继承这个控制器,所以也会继承这个控制器使用的布局 ...

我们可以给 photos 控制器创建一个布局 ... 默认 rails 会在 app/views/layouts 目录的下面,查找跟控制器基础名字一样的布局文件 ... 如果有的话就会使用这个布局 ..

在这个目录的下面新建一个布局文件 .. 名字是 photos.html.erb ... 随便在这里添加点东西 ... 一组 div ,上面加上一个 container 类 ... 再添加一个注释 ... 说明一下这是 photos layout

回到浏览器 .. . 访问一下 /photos 这个地址 ..

在页面上没有显示什么东西 ... 查看一下页面源代码 ... 你会看到刚才我们在 photos 这个布局里添加的代码 ... 说明处理这个请求的控制器方法使用了我们给它准备的布局 ...

在控制器里,你也可以使用一个 layout ,指定一下具体要使用的布局 ... 比如 one-column ... 在 views/layouts
下面创建一个新的布局 .. 名字是 one-column.html.erb

再添加点布局的代码 .. 添加一个 one column 注释,标记一下正在使用的布局 ...

回到浏览器上,再查看一下 ... 这里会有一个 one column 注释,说明使用的就是 one column 这个布局 ...

这个布局现在会用在所有的控制器方法里,你可以再给它添加一个 except ... 设置一下不想使用这个布局的控制器方法 .. 比如 show ...

定义一个 show 方法 ... 再给这个方法添加一个视图 ... 放在 app/views/photos 的下面,名字是 show.html.erb ..

回到浏览器... 访问一下使用 photos 的 show 这个方法处理的地址 ...

它使用的布局是 photos layout ...

layout:布局《 Rails:视图 》

统计

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

社会化网络

关于

微信订阅号

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