web-dev-qa-db-ja.com

インクルード、拡張、使用、マクロ、埋め込みの違いTwig

Twigのuseincludeの違いは何ですか?

ドキュメント

含める

includeステートメントはテンプレートを含み、そのテンプレートのレンダリングされたコンテンツを現在のものに返します。

{% include 'header.html' %}
Body here...
{% include 'footer.html' %}

使用する

useステートメントは、Twigにblocks.htmlで定義されたブロックを現在のテンプレートにインポートするように指示します(これはマクロに似ていますが、ブロック用です):

blocks.html

{% block sidebar %}{% endblock %}

main.html

{% extends "base.html" %}
{% use "blocks.html" %}
{% block title %}{% endblock %}
{% block content %}{% endblock %}

考えられる答え:

私は this が違いを説明するはずだと思います:

includeは、すべてのコードを外部ファイルから取得して、呼び出しの適切な場所にある実際のファイルにインポートします。

useは、リンクファイルを解析してコードの特定のセクションを検索し、現在のファイル内の同じ名前のブロックをこの外部ファイルで見つかったブロックで上書きするため、完全に異なります。

includeは、「このファイルを見つけて、ここに私のページでレンダリングする」のようなものです。

useは、「この他のファイルを解析して、ここで定義した自分のものの代わりに使用するブロック定義を見つけます」。

useコマンドでタスクに一致するものが見つからない場合、このファイルからは何も表示されません。


質問

説明は正しいですか?この違いに対する他の説明はありますか?

ありがとう

18
Pmpr

数か月後、私はこの質問へのさらなる参照のための回答を投稿します。クリアランスを高めるために、extendsimportmacroembedの説明も追加しました。

Twigには、さまざまなタイプの継承とコードの再利用があります。

含める

主な目標はコードの再利用です。 header.html.twig内のfooter.html.twigbase.html.twigを例として使用することを検討してください。

header.html.twig

<nav>
   <div>Homepage</div>
   <div>About</div>
</nav>

base.html.twig

{% include 'header.html.twig' %}
<main>{% block main %}{% endblock %}</main>

伸びる

主な目標は垂直継承です。例として、base.html.twighomepage.html.twigおよびabout.html.twig内で拡張することを検討してください。

base.html.twig

{% include 'header.html.twig' %}
<main>{% block main %}{% endblock %}</main>

homepage.html.twig

{% extends 'base.html.twig' %}

{% block main %}
<p>You are at the homepage</p>
{% endblock %}

about.html.twig

{% extends 'base.html.twig' %}

{% block main %}
<p>You are at the about page</p>
{% endblock %}

使用する

主な目標は水平再利用です。 sidebar.html.twigsingle.product.html.twigを拡張)およびproduct.layout.html.twigsingle.service.html.twigを拡張)ページ内でservice.layout.html.pageを使用することを検討してください。 (それはマクロのようですが、ブロック用です)

sidebar.html.twig

<aside>{% block sidebar %}{% endblock %}</aside>

single.product.html.twig

{% extends 'product.layout.html.twig' %}

{% use 'sidebar.html.twig' %}
{% block main %}
<p>You are at the product page for product number 123</p>
{% endblock %}

single.service.html.twig

{% extends 'service.layout.html.twig' %}

{% use 'sidebar.html.twig' %}
{% block main %}
<p>You are at the service page for service number 456</p>
{% endblock %}

大きい

主な目標は変数を持つ多くのテンプレートで再利用可能なマークアップを持つです。いくつかの変数を取得し、いくつかのマークアップを出力する関数を考えます。

form.html.twig

{% macro input(name, value, type) %}
    <input type="{{ type|default('text') }}" name="{{ name }}" value="{{ value|e }}" }}" />
{% endmacro %}

profile.service.html.twig

{% import "forms.html.twig" as forms %}

<div>{{ forms.input('username') }}</div>

埋め込む

主な目標はブロックの上書きです。 UseIncludeの両方の機能を併せ持っています。 pagination.html.twigproduct.table.html.twigへのservice.table.html.twigの埋め込みを検討してください。

pagination.html.twig

<div>
    <div>{% block first %}{% endblock %}</div>
    {% for i in (min + 1)..(max - 1) %}
        <div>{{ i }}</div>
    {% endfor %}
    <div>{% block last %}{% endblock %}</div>
</div>

product.table.html.twig

{% set min, max = 1, products.itemPerPage %}

{% embed 'pagination.html.twig' %}
    {% block first %}First Product Page{% endblock %}
    {% block last %}Last Product Page{% endblock %}
{% endembed %}

service.table.html.twig

{% set min, max = 1, services.itemPerPage %}

{% embed 'pagination.html.twig' %}
    {% block first %}First Service Page{% endblock %}
    {% block last %}Last Service Page{% endblock %}
{% endembed %}

埋め込みファイル(ここではpagination.html.twig)は現在のコンテキスト(ここではminmax変数)にアクセスできることに注意してください。また、埋め込みファイルに追加の変数を渡すこともできます。

pagination.html.twig

<p>{{ count }} items</p>
<div>
    <div>{% block first %}{% endblock %}</div>
    {% for i in (min + 1)..(max - 1) %}
        <div>{{ i }}</div>
    {% endfor %}
    <div>{% block last %}{% endblock %}</div>
</div>

product.table.html.twig

{% set min, max = 1, products|length %}

{% embed 'pagination.html.twig' with {'count': products|length } %}
    {% block first %}First Product Page{% endblock %}
    {% block last %}Last Product Page{% endblock %}
{% endembed %}
45
Pmpr