Volt Introduction and Docs

ビューバインディング

すべての views/*.html ファイル (ビューファイル) は、view バインディングを利用することで、他のビューの内部でレンダリングすることが可能です。ビューバインディングは「パス文字列」を受け取り、そのパスに応じたビューをレンダリングします。オリジナルのビューファイルで、ビューバインディングが配置された箇所の内容は置き換えられます。

<h1>Header stuff</h1>

{{ view "header" }}

header ファイルが以下であったとします。

<ul>
  <li><a href="/">Home</a></li>
  <li><a href="/about">About</a></li>
</ul>

オリジナルのファイルは以下のようにレンダリングされます。

<h1>Header stuff</h1>

<ul>
  <li><a href="/">Home</a></li>
  <li><a href="/about">About</a></li>
</ul>

(ビューバインディングが「header」ファイルの内容で置き換えられているのがわかるでしょう)

view に渡す文字列は「パス文字列」でなければなりません。ビューと後述するタグは、同様の方法でビューとコントローラーを探索します。

誰もが、アプリケーションの各パートごとのスコープと必要な機能を事前に定めておきたいと考えていることでしょう。しかし現実には、予想していた以上に規模が大きくなってしまったりして、思った通りに上手くいかないこともありがちです。ビューバインディングとタグによって、コントローラーとビューのレンダリングで、コードが同じビューのフォルダやコンポーネント、そして Gem にあるかどうかということを気にせずに済みます。ビューやタグが大きくなってきたら、その呼び出し側には変更を加えることなく、コントロールの場所を移すことができます。

サンプルのビューを例として、どのように探索されるのか見てみましょう。

{{ view "header" }}

「header」の文字列が与えられると、Volt は次の場所からビューのファイルを (順番に) 探します:

Section View File View Folder Component
header
:body header.html
:body index.html header
:body index.html index header
:body index.html index gems/header

ビューが見つかると、それに関連するコントローラーがまず読み込まれます。ビューファイルのためのコントローラー名は、常に {something}_controller.rb となります。{something} はビューの格納されたフォルダ名です。(ビューは常に {component}/views/{something}.html のように配置されなくてはいけません。views フォルダ配下のフォルダに対しては無効です)

Volt はビューのマッチングのために以下の順番でチェックします。

  1. セクション - (something.html などの) ビューファイルはセクションから構成されます。セクションは <:セクション名> で始まり、閉じタグはありません。Volt はまず同じビューファイル内のセクションを探し、マッチするものがあればそのセクションの HTML を使用します。

  2. ビュー - 次に、Volt は現在のビューファイルと同じ「views」フォルダにあるビューのファイルを探します。もしそこで見つかれば、ビューの Body セクションにレンダリングします。

  3. ビューのフォルダー - 上記で見つからなければ、Volt はコンポーネントのビューのフォルダーの中で、マッチする名前のもの、もしくは index.html を探します。そして、:Body セクションにレンダリングされます。もしコントローラーがビューのフォルダに存在していれば。

  4. コンポーネント - 次に、app/ 以下のすべてのフォルダーをチェックします。対象となるビューのパスは {component}/index/index.html で、:body セクションを持っているものになります。

  5. Gem - 最後に、volt で始まるすべての gem の app フォルダをチェックします。コンポーネントに対しても上記と同様のパスでチェックされます。

ビューがレンダリングされるたびに、新しいコントローラーのインスタンスがビューのコンテキストとして生成されることを覚えておいてください。

また、ビューバインディングを作成するときに、その名前に複数の探索パスを指定することもできます。各パートは / で区切る必要があります。例:

    {{ view "blog/comments" }}

上記の例の場合は以下のように探索します:

セクション ビューのファイル ビューのフォルダー コンポーネント
:comments blog.html
:body comments.html blog
:body index.html comments blog
:body index.html comments gems/blog

ビューのためのファイル (もしくはセクション) が見つかれば、それにマッチするコントローラーを探します。もし、ビューのファイルがコントローラーに関連付けられていなければ、新しい ModelController が使われます。コントローラーが見つかって読み込まれると、それに対応する「アクション (action)」メソッドが (存在すれば) コントローラー上で実行されます。アクションメソッドのデフォルトは、(.htmlを除いた)ビューファイルの名称と同じです。詳細はコールバックとアクションを参照してください。

オプション

コントローラーグループ

ビューの :controller_group オプションを使うことで、複数のビューバインディングが同じコントローラーのインスタンスを共有することが可能です。通常、独立したビューバインディング (例えば、view のインスタンスやページのタグ) は、それぞれ自身のコントローラーのインスタンスと同時に生成されます。ただ、2つ以上のビューバインディングが controller_group オプションの同一の文字列として渡された場合には、それらのバインディングはすべて単一のコントローラーオブジェクトを共有します。

この例は、新規の Volt アプリケーションの main.html ファイルに見ることができます。body と title のビューバインディングは controller_group: 'main' に渡され、それによって両者が同一のコントローラーのインスタンスを共有します。