Rails nested layout_html/css_WEB-ITnose-tutoriel HTML-php.cn

Rails nested layout_html/css_WEB-ITnose

WBOY

Libérer： 2016-06-21 08:51:37

original

1411 Les gens l'ont consulté

12 Apr 2016| rails

问题

某rails项目 layouts/application.html.erb

<!DOCTYPE html><html>  <head>    <meta charset="utf-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge">    <meta name="viewport" content="width=device-width, initial-scale=1">    <title><%= @title  %></title>    <meta name="keywords" content="<%= @keywords %>" />    <meta name="description" content="<%= @description %>" />    <%= csrf_meta_tags %>    <%= action_cable_meta_tag %>    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>  </head>  <body>    <%= yield %>    <footer>      ...    </footer>  </body></html>

Copier après la connexion

现在需要另一个子layout，他继承自layouts/application.html.erb，又有自己的内容，该怎么办呢？尽量把公共的部分抽出来，然后在不同的layout之间共享吗？

layouts/main.html.erb

<!DOCTYPE html><html>  <%= render 'head' %>  <body>    <div class="container">      <%= yield %>      <div class="sidebar">        ...      </div>    </div>    <%= render 'footer' %>  </body></html>

Copier après la connexion

这样可以解决问题但不完美，没有体现出继承关系来，如果layout复杂，可能需要抽出很多的共享部分出来，而且子模板还是有很多重复的代码。

嵌套模板

在 application_helper.rb中加入下面的方法:

def parent_layout(layout)  @view_flow.set(:layout, output_buffer)  output = render(:file => "layouts/#{layout}")  self.output_buffer = ActionView::OutputBuffer.new(output)end

Copier après la connexion

然后 layouts/main.html.erb就可以变成这样的了

<div class="container">  <%= yield %>  <div class="sidebar">    ...  </div></div><% parent_layout "application" %>

Copier après la connexion

直接在子模板中指定父模板，完美的继承关系，而且可以进行多次，比如

layouts/profile.html.erb

<div class="profile">  <%= render 'profile_nav' %>  <%= yield %></div><% parent_layout "main" %>

Copier après la connexion

最后这3个layout的关系如下：

application < main < profile

Reference

http://m.onkey.org/nested-layouts

Php8, je viens aussi

Apprenez la mise en page d'un site Web en 30 minutes

Tutoriel vidéo Shangguan Oracle débutant à compétent

Votre première ligne de code UNI-APP

Flutter de zéro au lancement de l'application

Brother Lian Nouveau didacticiel vidéo Linux

Tutoriel vidéo AXURE 9 (convient à l'interface utilisateur interactive de conception de produits du chef de produit)

Tutoriel vidéo PS Zero Basic Proficiency

Tutoriel vidéo de 16 jours sur l'interface utilisateur pour vous aider à démarrer

Tutoriel vidéo sur les techniques PS et les techniques de découpage

Tutoriel vidéo sur la construction et le lancement de projets d'Alibaba Cloud Environment

Présentation des réseaux informatiques - Connaissances de base que les programmeurs doivent maîtriser

Tutoriel essentiel pour les programmeurs - Explication du protocole HTTP

Tutoriel vidéo Websocket

Rails nested layout_html/css_WEB-ITnose

问题

嵌套模板

Reference