参考链接：http://guides.ruby-china.org/layouts_and_rendering.html#%E9%9D%99%E6%80%81%E8%B5%84%E6%BA%90%E6%A0%87%E7%AD%BE%E5%B8%AE%E5%8A%A9%E6%96%B9%E6%B3%95

讲rails布局就得先说说yield关键字。

  1. 在rails布局中，yield标明一个区域，渲染的视图会插入这里。最简单的情况是只有一个 yield，此时渲染的整个视图都会插入这个区域：

    <html>
    
  <head>
    
  </head>
    
  <body>
    
  <%= yield %>
    
  </body>
    
</html>

    布局中也可以标明多个区域，这个就需要使用具名yield，然后使用content_for方法。对于未命名的yield，视图的主体就会插入到未命名的yield区域。

    #主布局  application.html.erb
    
<html>
    
  <head>
    
  <%= yield :head %>
    
  </head>
    
  <body>
    
  <%= yield %>
    
  </body>
    
</html>

#子页面
    
<% content_for :head do %> #插入到主布局的 <%= yield :head %>位置
    
  <title>A simple page</title>
    
<% end %>

<p>Hello, Rails!</p>#插入到主布局的  <%= yield %>位置

#最后生成的html
    
<html>
    
  <head>
    
  <title>A simple page</title>
    
  </head>
    
  <body>
    
  <p>Hello, Rails!</p>
    
  </body>
    
</html>

    如果布局不同的区域需要不同的内容，例如侧边栏和底部，就可以使用 content_for 方法。content_for 方法还可用来在通用布局中引入特定页面使用的 JavaScript 文件或 CSS 文件。

    以上都是对于在application.html.erb的全局布局来说的。

  2. 具名局部视图
    在视图中渲染局部视图可以使用 render 方法： 
    <%= render "menu" %>

    渲染这个视图时，会渲染名为 _menu.html.erb 的文件。注意文件名开头的下划线：局部视图的文件名开头有个下划线，用于和普通视图区分开，不过引用时无需加入下划线。即便从其他文件夹中引入局部视图，规则也是一样：

    <%= render "shared/menu" %>
    
#这行代码会引入 app/views/shared/_menu.html.erb 这个局部视图。

    局部视图的一种用法是作为“子程序”（subroutine），把细节提取出来，以便更好地理解整个视图的作用。例如，有如下的视图：

    <%= render "shared/ad_banner" %>

<h1>Products</h1>

<p>Here are a few of our fine products:</p>
    
...

<%= render "shared/footer" %>

    这里，局部视图 _ad_banner.html.erb 和 _footer.html.erb 可以包含程序多个页面共用的内容。在编写某个页面的视图时，无需关心这些局部视图中的详细内容。

  3. 局部布局
    和视图可以使用布局一样，局部视图也可使用自己的布局文件。例如，可以这样调用局部视图： 
    <%= render partial: "link_area", layout: "graybar" %>

    这行代码会使用 _graybar.html.erb 布局渲染局部视图 _link_area.html.erb。注意，局部布局的名字也以下划线开头，和局部视图保存在同个文件夹中（不在 layouts 文件夹中）。

    还要注意，指定其他选项时，例如 :layout，必须明确地使用 :partial 选项。

    但是我在实际使用中，也是把局部布局保存在layouts文件夹中，使用的时候

    <%= render partial: "link_area", layout: "layouts/graybar" %>
    #为了保证不出错，可以这么写
    <%= render partial: "link_area.html.erb", layout: "layouts/graybar.html.erb" %>

    在使用render :partical时，可以向局部视图传递本地变量

    #传递本地变量
    
<h1>New zone</h1>
    
<%= render partial: "form", locals: {zone: @zone} %>

#使用
    
<%= form_for(zone) do |f| %>
    
  <p>
    
    <b>Zone name</b><br>
    
    <%= f.text_field :name %>
    
  </p>
    
  <p>
    
    <%= f.submit %>
    
  </p>
    
<% end %>
    #还有些其他方式传递，见前面的参考链接

ruby on rails全局布局,局部视图,局部布局的更多相关文章

  1. HTML CSS + DIV实现局部布局

    HTML CSS + DIV实现局部布局 HTML CSS + DIV实现局部布局 1.本章教大家掌握2种布局方式: 1)顶部导航菜单布局,效果图: 2)购物版块布局,效果图: 2.技术目标: 使用d ...

  2. 【转载】CSS + DIV 实现局部布局

    HTML CSS + DIV实现局部布局 1.本章教大家掌握2种布局方式: 1)顶部导航菜单布局,效果图: 2)购物版块布局,效果图: 2.技术目标:使用div + ul-li实现导航菜单布局    ...

  3. 自适应XAML布局经验总结 （三） 局部布局设计模式2

    本系列对实际项目中的XAML布局场景进行总结,给出了较优化的自适应布局解决方案,希望对大家有所帮助. 下面继续介绍局部布局设计模式. 5. 工具箱模式 绘图,三维模型操作等需要工具的情况,可以使用带分 ...

  4. 自适应XAML布局经验总结 （二） 局部布局设计模式1

    本系列对实际项目中的XAML布局场景进行总结,给出了较优化的自适应布局解决方案,希望对大家有所帮助. 下面开始介绍局部布局设计模式. 1. 工具栏模式 适用于工具栏,标题等的布局. 此块布局区域外层使 ...

  5. Ruby on Rails Tutorial读书笔记-1

    只是怕忘了命令,全部撸一次,记个大概.. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 安装Ruby之前,先要安装RVM: curl -L https://get.rvm.io | bas ...

  6. Ruby on Rails框架开发学习

    学习地址:http://www.ixueyun.com/lessons/detail-lessonId-685.html 一.课程概述 软件开发在经历了面向过程编程的阶段,现在正大行其道的是敏捷开发, ...

  7. [ruby on rails] 跟我学之(7)创建数据

    通过form来创建数据,本章节将会涉及内容:创建form,用户重导向,渲染views 和 flash消息. 1. views初步 编辑 app/views/posts/index.html.erb这个 ...

  8. Android：控件布局（表格布局）TableLayout

    TableLayout继承LinearLayout 实例:用表格布局实现计算机布局>>>>>>>>>>>> 有多少个TableR ...

  9. 《Ruby on Rails教程》学习笔记

    本文是我在阅读 Ruby on Rails 教程的简体中文版时所做的摘录,以及学习时寻找的补充知识.补充知识主要来自于 Ruby on Rails 實戰聖經. Asset Pipeline 在最新版 ...

随机推荐

  1. SpringSercurity基础

    创建 spring 配置文件 spring-security.xml intercept-url 表示拦截页面    /*  表示的是该目录下的资源,只包括本级目录不包括下级目录 /** 表示的是该目 ...

  2. Mac下怎么运行python3的py文件

    我的Mac现在是10.14.6系统,默认自带的python版本是2.7.(怎么查看版本?打开终端,输入python即可看到版本号) 由于现在需要运行python3写的py文件,需要将自带的python ...

  3. LuoguP2115 [USACO14MAR]破坏Sabotage【二分答案】By cellur925

    本来是想找一道生成树的题做的...结果被洛咕的标签骗到了这题...结果是二分答案与生成树一点mao关系都没有.... 题目大意:给你一个序列,请你删去某一个$l~r$区间的值($2<=i< ...

  4. Centos 6.8 配置Lvs

    LVS是Linux Virtual Server的简写,意即Linux虚拟服务器,是一个虚拟的服务器集群系统.本项目在1998年5月由章文嵩博士成立,是中国国内最早出现的自由软件项目之一. 宗旨: 使 ...

  5. Android Studio无法预览xml布局之解决方法（两种）

    学习安卓程序开发,用的Android Studio,发现怎么更改xml代码都没有想要的效果.如图 代码如下: <?xml version="1.0" encoding=&qu ...

  6. Codeforces Round #418 (Div. 2) C

    Description Nadeko's birthday is approaching! As she decorated the room for the party, a long garlan ...

  7. (转) ACM必备（学完一个就加亮一个）不多，就这些！

    时间复杂度(渐近时间复杂度的严格定义,NP问题,时间复杂度的分析方法,主定理)排序算法(平方排序算法的应用,Shell排序,快速排序,归并排序,时间复杂度下界,三种线性时间排  序,外部排序)数论(整 ...

  8. 阻止默认行为是配合passive使用

    在使用lighthouse检测pwa应用时,发现提示下面有下面的警告 默认使用passive:true提高滚动性能并减少崩溃,passive即顺从的,是指它顺从浏览器的默认行为.设置该属性的目的主要是 ...

  9. 微信小程序开发常见的拉起外部地图软件进行导航的功能

    <view class="dh" bindtap="mapNavigation" data-addr="{{address}}"> ...

  10. HDU 1423 LICS 模板

    http://acm.hdu.edu.cn/showproblem.php?pid=1423 4.LICS.O(lena * lenb) 设dp[i][j]表示a[]的前i项,以b[]的第j项结尾时, ...