Help us understand the problem. What is going on with this article?

【PHP】Twigまとめ

業務でtwigを使用しているのですが、情報を探すのに一苦労したので
コマンド一覧まとめ。

twigとは

PHP製のテンプレートエンジン。
インストール〜初期設定は下記記事などでまとめてくださっています
https://qiita.com/atwata/items/50e84e14b107dd111d71
https://qiita.com/tomk79/items/5ab61b4b24fb80fe8a90

1.全体

インストール(twigbridge使用)

環境:Laravel5.5

GitHub - rcrowe/TwigBridge: Give the power of Twig to Laravel

Laravel使用されていれば、TwigBridgeの公式の通り実行すれば簡単!
英語なので補足で説明します。

Composerでインストール

composer require rcrowe/twigbridge

もしcomposerが既に導入されて入れば、このコマンドでinstallができます。

クイックスタート

まずは、configディレクトリのapp.phpを2箇所編集します。

app.php
'providers' => [
     ...
    /*
     * Package Service Providers...//Laravelに登録する
     */
                TwigBridge\ServiceProvider::class,
],

...

'aliases' => [
    ... 
    /* Package Aliase */ //Twigという名前で簡単に呼び出せるようにする
                'Twig' => TwigBridge\Facade\Twig::class,
],

こうして登録できたので、最後に、artisanコマンドを使用して
twigの設定ファイルを追加します。

php artisan vendor:publish --provider="TwigBridge\ServiceProvider"

これで下準備はおしまいです。

あとはresouse/viewディレクトリの傘下に、
.twigという拡張子がtwigのファイルを作成すればtwig形式で記載ができます。

私はlayoutsフォルダにdefaultを格納して、それらを継承しています。

継承

extends.php
{% extends 'ファイルパス' %} 
  • 別ファイルから継承する(複数はNG)
  • 親ブロックを子ブロックが上書きする
  • {% block ブロック名%}〜{% endblock %}

挿入

{% include 'ファイルパス'%}
{% include 'aa/aa' with { 'aa' : 'aa' } %} //引数も取れます

コメント文

{# ここにコメントを書く#}

CSRF対策

{{ csrf_field() }}

HTML文のエスケープ

// 追記しました、ご指摘ありがとうございます!

{{ html文 | e("<a>aaa</a>") }} 

その他

{{ 変数 | length }} //文字数
{{ dump() }} //PHPのdumpと一緒

2.変数

書き方

{{ 変数名 }}

※ただし条件式の中では{{}}は不要。(例:{% if post="hello" %})

定義方法

①同じTwig内で設定する

{% set 変数名='value' %}
  • 配列の場合は{% set array = [ A, B ] %}
  • 連想配列は{% set array =  [ key : value ] %}

②Controllerなどから渡す

変数:{{ 変数名 }}
配列:{{ 変数名.キー名 }} ※連想配列も可

▼例 (部分抜粋)

app/Controllers/PostController.php
$url = 'URLです';
$post = $this->post_model->getPostArray();
    // 'id' => '1', 'title' => 'タイトル'
return view('post/show',
[
    'url' =>$url, //変数 
    'post' =>$post //配列
];
resouse/view/post/show.twig
<p>変数は「{{ url }}」です。</p>
<p>配列は idが{{ post.id }}で、
titleが{{ post.title }}です。</p>

出力結果

変数は「URLです」です。
配列は idが1で、titleがタイトルです。

その他

バリデーションエラーなど定型変数の時の書き方

input_old('タグの名前') // セッションなどで確認フォーム利用時
errors.first('タグの名前') //バリデーションエラー時

3.条件式

if文

{% if 条件式 %}
{% endif %}
  • 通常のif文が上記の書き方で使える
  • 条件式内で変数を定義した場合、条件文外では使用不能
  • 条件文内では、変数に{{}}はつけない
  • else文、elseif文、複数条件の場合はandやorも使用可能
{% if 条件式A and 条件式B %}
{% elseif 条件式 %}
{% else %}
{% endif %}

for文

{% for i = 1 1..100 %}
{% endfor %}
  • iは任意です
  • 連想配列の場合は{% for key, value in 配列名 %}

foreach文( ループ, for in で代用 )

{% for hoge in array %}
{% endfor %}
  • arrayに任意の配列、hogeも任意の名前です

三項演算子

{{ 条件文 ? 処理A : 処理B }}
  • 条件文が正の時にA、誤の時B

例文

①テンプレート・変数を使用したページ

sample.twig
{% extends 'layout/user_default'%}
{% block content %}
{% set title='hello' %}
<div class="sample">
    <h1>{{ title }}</h1>
</div>
{% endblock %}

 

②Emailのフォーム(一部抜粋)

email.twig
<div class="form-group">
    <label for="f-email">Email address</label>
    <input type="email" name="email" class="form-control" id="f-mail"
     value="{{input_old('email')}}" placeholder="entry@leverages.jp">
     {% if errors.first('email')|length > 0 %}
    <span class="text-danger">{{errors.first('email')}}</span>
    {% endif %}
</div>

 

公式リンク

https://twig.symfony.com/

以上

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした