Ruby on Rails
Keer bekeken
Zoeken…
Partials
Gedeeltelijke sjablonen (gedeeltelijke) zijn een manier om het renderingproces op te delen in beter beheersbare brokken. Met partials kunt u stukjes code uit uw sjablonen halen om bestanden te scheiden en deze ook opnieuw gebruiken in uw sjablonen.
Als u een gedeeltelijke wilt maken , maakt u een nieuw bestand dat begint met een onderstrepingsteken: _form.html.erb
Een gedeeltelijke maken als onderdeel van het oog, maken gebruik van de methode in het oog: <%= render "form" %>
- Let op, het onderstrepingsteken wordt weggelaten bij het renderen
- Een gedeeltelijke weergave moet met behulp van het pad worden weergegeven als deze zich in een andere map bevindt
Gebruik deze notatie om een variabele door te geven aan de gedeeltelijke als een lokale variabele:
<%= render :partial => 'form', locals: { post: @post } %>
Partials zijn ook handig als je nodig hebt om precies opnieuw dezelfde code (DRY filosofie).
Als u bijvoorbeeld <head>
-code opnieuw wilt gebruiken, maakt u een gedeeltelijke naam _html_header.html.erb
, voert u uw <head>
-code in die moet worden hergebruikt en geeft u de gedeeltelijke waar nodig weer door: <%= render 'html_header' %>
.
Object partials
Objecten die reageren to_partial_path
kunnen ook worden weergegeven, zoals in <%= render @post %>
. Voor ActiveRecord-modellen is dit standaard zoiets als posts/post
, dus door @post
daadwerkelijk weer te @post
, worden de bestandsweergaven views/posts/_post.html.erb
weergegeven.
Een lokaal benoemd post
wordt automatisch toegewezen. Uiteindelijk is <%= render @post %>
een korte hand voor <%= render 'posts/post', post: @post %>
.
Collecties van objecten die reageren to_partial_path
kunnen ook worden verstrekt, zoals <%= render @posts %>
. Elk item wordt opeenvolgend weergegeven.
Wereldwijde partials
Om een globaal deel te maken dat overal kan worden gebruikt zonder te verwijzen naar het exacte pad, moet het deel zich in het views/application
. Het vorige voorbeeld is hieronder aangepast om deze functie te illustreren.
Dit is bijvoorbeeld een pad naar een algemene gedeeltelijke app/views/application/_html_header.html.erb:
Gebruik <%= render 'html_header' %>
om dit globale deel overal weer te <%= render 'html_header' %>
AssetTagHelper
Om rails automatisch en correct activa (css / js / images) te laten koppelen, wilt u in de meeste gevallen ingebouwde helpers gebruiken. ( Officiële documentatie )
Afbeelding helpers
image_path
Dit retourneert het pad naar een afbeeldingsitem in app/assets/images
.
image_path("edit.png") # => /assets/edit.png
afbeelding URL
Dit retourneert de volledige URL naar een afbeeldingsitem in app/assets/images
.
image_url("edit.png") # => http://www.example.com/assets/edit.png
image_tag
Gebruik deze helper als u een <img src="" />
-tag wilt toevoegen aan de bronset.
image_tag("icon.png") # => <img src="/assets/icon.png" alt="Icon" />
JavaScript-helpers
javascript_include_tag
Als u een JavaScript-bestand in uw weergave wilt opnemen.
javascript_include_tag "application" # => <script src="/assets/application.js"></script>
javascript_path
Dit retourneert het pad van uw JavaScript-bestand.
javascript_path "application" # => /assets/application.js
javascript_url
Dit retourneert de volledige URL van uw JavaScript-bestand.
javascript_url "application" # => http://www.example.com/assets/application.js
Helpers van stylesheets
stylesheet_link_tag
Als u een CSS-bestand in uw weergave wilt opnemen.
stylesheet_link_tag "application" # => <link href="/assets/application.css" media="screen" rel="stylesheet" />
stylesheet_path
Dit retourneert het pad van uw stijlbladitem.
stylesheet_path "application" # => /assets/application.css
stylesheet_url
Dit retourneert de volledige URL van uw stijlbladitem.
stylesheet_url "application" # => http://www.example.com/assets/application.css
Voorbeeld gebruik
Wanneer u een nieuwe rails-app maakt, hebt u automatisch twee van deze helpers in app/views/layouts/application.html.erb
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
Dit geeft uit:
// CSS
<link rel="stylesheet" media="all" href="/assets/application.self-e19d4b856cacba4f6fb0e5aa82a1ba9aa4ad616f0213a1259650b281d9cf6b20.css?body=1" data-turbolinks-track="reload" />
// JavaScript
<script src="/assets/application.self-619d9bf310b8eb258c67de7af745cafbf2a98f6d4c7bb6db8e1b00aed89eb0b1.js?body=1" data-turbolinks-track="reload"></script>
Structuur
Aangezien Rails het M V C-patroon volgt, zijn Views
uw "sjablonen" voor uw acties.
Stel dat u een controller articles_controller.rb
. Voor deze controller zou je een map in views hebben genaamd app/views/articles
:
app
|-- controllers
| '-- articles_controller.rb
|
'-- views
'-- articles
| |- index.html.erb
| |- edit.html.erb
| |- show.html.erb
| |- new.html.erb
| '- _partial_view.html.erb
|
'-- [...]
Met deze structuur kunt u een map hebben voor elke controller. Wanneer u een actie in uw controller oproept, wordt de juiste weergave automatisch weergegeven.
// articles_controller.rb
class ArticlesController < ActionController::Base
def show
end
end
// show.html.erb
<h1>My show view</h1>
Vervang HTML-code in Views
Als u ooit de html-inhoud wilde bepalen die tijdens runtime op een pagina moet worden afgedrukt, heeft rails daar een zeer goede oplossing voor. Het heeft iets genaamd content_for waarmee we een blok kunnen doorgeven aan een railweergave. Controleer het onderstaande voorbeeld,
Declareer content_for
<div>
<%= yield :header %>
</div>
<% content_for :header do %>
<ul>
<li>Line Item 1</li>
<li>Line Item 2</li>
</ul>
<% end %>
HAML - een alternatieve manier om in uw weergaven te gebruiken
HAML (HTML-abstractiemarkuptaal) is een mooie en elegante manier om de HTML van uw weergaven te beschrijven en te ontwerpen. In plaats van tags voor openen en sluiten, gebruikt HAML inspringen voor de structuur van uw pagina's. Kortom, als er iets in een ander element moet worden geplaatst, laat u het gewoon inspringen door één tabstop te gebruiken. Tabbladen en witruimte zijn belangrijk in HAML, dus zorg ervoor dat u altijd hetzelfde aantal tabbladen gebruikt.
Voorbeelden:
#myview.html.erb
<h1><%= @the_title %></h1>
<p>This is my form</p>
<%= render "form" %>
En in HAML:
#myview.html.haml
%h1= @the_title
%p
This is my form
= render 'form'
U ziet, de structuur van de lay-out is veel duidelijker dan het gebruik van HTML en ERB.
Installatie
Installeer gewoon de edelsteen met
gem install haml
en voeg de edelsteen toe aan de Gemfile
gem "haml"
Als u HAML in plaats van HTML / ERB wilt gebruiken, vervangt u gewoon de bestandsextensies van uw weergaven van something.html.erb
naar something.html.haml
.
Snelle tips
Gemeenschappelijke elementen zoals divs kunnen op een korte manier worden geschreven
HTML
<div class="myclass">My Text</div>
HAML
%div.myclass
HAML, steno
.myclass
attributen
HTML
<p class="myclass" id="myid">My paragraph</p>
HAML
%p{:class => "myclass", :id => "myid"} My paragraph
Ruby-code invoegen
U kunt ruby code invoegen met de = en - tekens.
= link_to "Home", home_path
Code die begint met = wordt uitgevoerd en ingebed in het document.
Code die begint met - wordt uitgevoerd, maar niet in het document ingevoegd.
Volledige documentatie
HAML is heel eenvoudig om mee te beginnen, maar is ook erg complex, dus ik raad aan de documentatie te lezen .