1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

パーシャルとは?

Last updated at Posted at 2022-09-21

パーシャルとは?

レンダリング処理を扱いやすい単位に分割するしくみです。

パーシャルの表記方法

パーシャルをビューの一部としてレンダリングするには、ビュー内で以下のようにrender メソッドを使います。

<%= render "menu" %>

パーシャルのファイルの名前の注意点

レンダリングされるビュー内に置かれている上のコードは、その場所で_menu.html.erbという名前のファイルをレンダリングします。パーシャルファイル名の冒頭にはアンダースコアが付いていることにご注意ください。

_(アンダースコア)をつけない場合もある

アンダースコアは通常のビューと区別するために付けられていますが、アンダースコアなしで参照されることもあります。これは他のフォルダの下にあるパーシャルを取り込む場合も同様です。

<%= render "shared/menu" %>

上のコードは、app/views/shared/_menu.html.erbパーシャルをその位置に取り込みます。

パーシャルをサブルーチンのように扱う

パーシャルをサブルーチンと同様に扱うことです。表示の詳細をパーシャル化してビューから追い出し、コードを読みやすくします。

<%= render "shared/ad_banner" %>

<h1>Products</h1>

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

<%= render "shared/footer" %>

パーシャルレイアウト

ビューにレイアウトがあるのと同様に、パーシャルでも独自のレイアウトファイルを利用できます

<%= render partial: "link_area", layout: "graybar" %>

上のコードの意味

上のコードは、_link_area.html.erbという名前のパーシャルを探索し、_graybar.html.erbという名前のレイアウトでレンダリングします。
:layoutなどの追加オプションも渡す場合は、:partialオプションも明示的に指定する必要があります。

パーシャル用のレイアウトファイルにもアンダースコアをつける

パーシャル用のレイアウトファイルは、対応する通常のパーシャルと同様、パーシャル名の冒頭にアンダースコアを追加する。

パーシャルファイルの位置

(マスターのlayoutsディレクトリではなく)そのレイアウトが属しているパーシャルファイルと同じディレクトリに配置します。

パーシャルにローカル変数を渡す

パーシャルにローカル変数を渡すことで、パーシャルがさらに強力かつ柔軟になります。たとえば、以下のようにnewページとeditページの違いがごくわずかしかない場合は、この手法でコードの重複を解消できます。

<h1>New zone</h1>
<%= render partial: "form", locals: {zone: @zone} %>
<h1>Editing zone</h1>
<%= render partial: "form", locals: {zone: @zone} %>
<%= form_with model: zone do |form| %>
  <p>
    <b>Zone name</b><br>
    <%= form.text_field :name %>
  </p>
  <p>
    <%= form.submit %>
  </p>
<% end %>

状況に応じてローカル変数を渡す local_assigns

index.html.erb

<%= render user.articles %>

show.html.erb

<%= render article, full: true %>

_article.html.erb

<h2><%= article.title %></h2>

<% if local_assigns[:full] %>
  <%= simple_format article.body %>
<% else %>
  <%= truncate article.body %>
<% end %>

これにより、すべてのローカル変数を宣言せずにパーシャルを使えるようになります。

yieldとは?

レイアウトのコンテキスト内では、ビューのコンテンツを挿入する位置をyieldで指定します。
yieldの最もシンプルな使い方は、以下のようにyieldを1個だけ使って、現在レンダリングされているビューのコンテンツ全体をその位置に挿入することです。

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

気づき

まだyieldを理解できていないがこれからまた勉強して理解できるようになる。
これをもとにパーシャルを使えるようになる。
そしてまだ理解できていないことを理解できていないと思っている。
これからまた上書きもしくは、さらに記事にしたいと思う。
とりあえずrenderでパーシャルを試してみたい。

出典

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?