博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
ruby on rails全局布局,局部视图,局部布局
阅读量:4330 次
发布时间:2019-06-06

本文共 1827 字,大约阅读时间需要 6 分钟。

参考链接:

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

 

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

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

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

    Hello, Rails!

    #插入到主布局的 <%= yield %>位置#最后生成的html A simple page

    Hello, Rails!

    如果布局不同的区域需要不同的内容,例如侧边栏和底部,就可以使用 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" %> 

    Products

    Here are a few of our fine products:

    ... <%= 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时,可以向局部视图传递本地变量

    #传递本地变量

    New zone

    <%= render partial: "form", locals: {zone: @zone} %>#使用<%= form_for(zone) do |f| %>

    Zone name

    <%= f.text_field :name %>

    <%= f.submit %>

    <% end %> #还有些其他方式传递,见前面的参考链接

 

转载于:https://www.cnblogs.com/jecyhw/p/5152939.html

你可能感兴趣的文章
小D课堂 - 零基础入门SpringBoot2.X到实战_第11节 Logback日志框架介绍和SpringBoot整合实战_45、SpringBoot2.x日志讲解和Logback配置实战...
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_1_02技术选型
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_汇总
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_2_01传统架构演进到分布式架构
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_2_02 微服务核心基础讲解
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_2_04微服务下电商项目基础模块设计...
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_3-01 什么是微服务的注册中心
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_3-03CAP原理、常见面试题
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_3-04 SpringCloud微服务核心组件Eureka介绍和闭源后影响...
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_3-05 服务注册和发现Eureka Server搭建实战...
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_3-06 服务注册和发现之Eureka Client搭建商品服务实战...
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_3-07 Eureka服务注册中心配置控制台问题处理...
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_4-01 常用的服务间调用方式讲解
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_4-02 微服务调用方式之ribbon实战 订单调用商品服务...
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_4-03 高级篇幅之Ribbon负载均衡源码分析实战...
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_4-06 Feign核心源码解读和服务调用方式ribbon和Feign选择...
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_4-05 微服务调用方式之feign 实战 订单调用商品服务...
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_5-02 Netflix开源组件断路器
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_5-01分布式核心知识之熔断、降级
查看>>
小D课堂 - 新版本微服务springcloud+Docker教程_5-04 feign结合hystrix断路器开发实战下...
查看>>