Twigとは？
Twigについての情報って少ないですよね。書籍もほとんどなし。下のほうで紹介している、Twigの本を参考にするのも良いでしょう。
Twigとは何でしょう？僕はTwigとは、何かしらの言語かと思っていました。
が、しかし、これは勘違いのようです。
正確には、PHP製のテンプレートエンジンです。
テンプレートエンジンとは？ちょっと難しくなるのですが、簡単に考えますと、データとテンプレートを合体させて、文字列を作る仕組みのことです。
PHPで考えると、データというのはオブジェクトや配列を指し、テンプレートエンジン自体はPHPのライブラリと考えて問題ありません。
どのように使う？
本来は、Laravelなどのプラットフォームからインストールして使用する方法が普通のようですが、EC-CUBEでは元からTwigを使用する仕組みが備わっています。
EC-CUBEでTwigを使うとなる場合は、特に何も考えなくて良いです。
Twigの基本構文
以前も触れましたが、Twigの基本構文はだいたい3つのパターンです。
- 表示させる ・・・ {{ 値 }}
- 処理をする ・・・ {% 処理 %}
- コメントを入れる ・・・ {# テキスト #}
これだけですので、特に混乱することはありませんよね？
様々な使用法
コメント文
{# ここにコメント文を記述します #}変数
{{ 変数名 }}※ただし条件式の中では{{}}は不要で、例えば「{% if message="hello" %}」のようになります。
条件式
if文
{% if 条件式 %}
{% endif %}更には次のような使い方も可能です。
{% if 条件式A and 条件式B %}
{% elseif 条件式 %}
{% else %}
{% endif %}for文
{% for i = 1 1..100 %}
{% endfor %}foreach文（for in で代用）
{% for key in value %}
{% endfor %}keyは任意の名前、valueも任意の配列を指します。
三項演算子
{{ 条件式 ? 処理A : 処理B }}条件式が正を満たすときに処理Aを行い、誤のときに処理Bを行います。
継承
{% extends 'ファイルパス' %}- 別ファイルから継承します。但し、複数はNGです。
- 親ブロックを子ブロックが上書きする場合です。
- {% block ブロック名 %}～{% endblock %}
挿入
{% include 'ファイルパス' %}
{% include 'aaa/bbb' with { 'aaa' : 'bbb' } %} // 引数も取れますCSRF対策
{{ csrf_field() }}HTML文のエスケープ
{{ html文 | e("<a>test</a>") }}同じTwig内で設定する方法
{% set 変数名 = 'value' %}
{% set array = [ A , B ] %} // 配列の場合
{% set array = [ key : value ] %} // 連想配列の場合Controllerなどから渡す場合
変数：{{ 変数名 }}
配列：{{ 変数名.キー名 }} ※連想配列も可以下、例を示します。
$url = 'https://shirakawaroom.com';
$post = $this->post_model->getPostArray(); // 'id' => '1', 'title' => 'タイトル'
return view('post/show',
[
'url' => $url, // 変数
'post' => $post // 配列
];Twigファイル
<p>変数は「{{ url }}」です。</p>
<p>配列は、idが{{ post.id }}で、titleが{{ post.title }}です。</p>出力結果
変数は「https://shirakawaroom.com」です。 配列は、idが1で、titleがタイトルです。
となります。
その他
{{ 変数 | length }} // 文字数
{{ dump() }} // PHPのdumpと同じバリデーションエラーなど、定型変数のときの書き方
input_old('タグの名前') // セッションなどで確認フォームを利用するとき
errors.first('タグの名前') // バリデーションエラー時例文
テンプレート・変数を使用したページ
{% extends 'layout/user_default' %}
{% block content %}
{% set title='hello' %}
<div class="sample">
<h1>{{ title }}</h1>
</div>
{% endblock %}E-mailのフォーム（一部抜粋したもの）
<div class="form-group">
<label for="f-email">E-mail Address</label>
<input type="email" name="email" class="form-control" id="f-mail" ...(略)...
value="{{ input_old('email') }}" placeholder="entry@example.com">
{% if errors.first('email') | length > 0 %}
<span class="text-danger">{{ errors.first('email') }}</span>
{% endif %}
</div>まとめ
以上、Twigにはさまざまな使い方があることがわかりましたね。
ここで使われている方法や、あとは自身でいろいろと調べて、Twigについて研鑽を深めていきましょう。
下で売ってる本、おすすめですよ。
ここまで読んでいただき、有り難うございました。
応援していただけると励みになります。
ポチップ
コメント