Laravel Blade：コンポーネントを使用して、再利用可能なテーブル構造を効率的に構築します

この記事では、Laravel Bladeのテーブル要素の挿入と管理を簡素化する方法について説明します。繰り返しのテーブルラインコードの問題に応じて、Laravel Bladeコンポーネント（コンポーネント）を使用して再利用可能なHTML構造をカプセル化して、コードのモジュール式で明確で効率的なメンテナンスを実現する方法を紹介します。デモンストレーションの例を通じて、読者はブレードコンポーネントを作成および使用する方法を習得し、それによりフロントエンドテンプレート開発プロセスを最適化します。

Laravelアプリケーションの開発では、テーブルの行（

）など、ビュー内で同様のHTML構造を繰り返しレンダリングする必要がある状況に遭遇することがよくあります。従来、開発者は、@sectionと@showと組み合わせてBladeの@includeディレクティブを使用して、これらの重複要素を挿入しようとするかもしれません。ただし、@sectionと@showは、主にコンポーネントの再利用ではなく、レイアウトの継承とコンテンツインジェクションに使用されます。このアプローチは、変数に合格する必要があり、コードを簡潔に保つ必要がある場合に期待される結果を達成するのに苦労し、コード構造の混乱につながる可能性さえあります。たとえば、次のコードは、@sectionを定義するテンプレートを含む@includeでテーブル行を挿入しようとします。

 
@section（ 'insert'）
    <tr>
        <th>
            {{$ th}}
        </th>
        <td>
            
        </td>
    </tr>
@見せる

@include（ 'util.insert'、['th' => 'th1'、 'name' => 'name1'、 'val' => 'val1']） @include（ 'util.insert'、['th' => 'th2'、 'name' => 'name2'、 'val' => 'val2']））

この方法では、 @sectionは通常、@includeのたびに独立してレンダリングするのではなく、親テンプレートによって参照できるコンテンツブロックを定義するために使用されるため、予想どおりに複数の独立したテーブル行をレンダリングしません。この問題をよりエレガントかつ効率的に解決するために、Laravelは強力なブレードコンポーネント機能を提供します。

Laravel Bladeコンポーネントを使用して、再利用可能なテーブル要素を構築します

ブレードコンポーネントは、UIコンポーネント化を実装し、Laravelのコードの再利用性と保守性を向上させる推奨方法です。これにより、HTMLフラグメントを別々の論理単位にカプセル化し、シンプルなタグ構文を介してビューでそれらを参照することができます。

1.コンポーネントを作成します

まず、ブレードコンポーネントを作成する必要があります。職人コマンドを介してすぐにそれを生成できます。

 PHP Artisan Make：コンポーネントTablerow

このコマンドは2つのファイルを生成します。

• App/View/Components/TableRow.php：コンポーネントのロジックと受信プロパティを定義するために使用されるコンポーネントのPHPクラスファイル。
• リソース/ビュー/コンポーネント/テーブルロウ.blade.php：コンポーネントのHTML構造を定義するコンポーネントのブレードビューファイル。

2。コンポーネントロジックとプロパティを定義します

App/View/Components/TableRow.phpファイルを開き、そのコンストラクターを変更して、必要なプロパティ（たとえば、名前、VAL）を受信します。

  th = $ th;
        $ this-> name = $ name;
        $ this-> val = $ val;
    }

    /**
     *コンポーネントを表すビュー /コンテンツを取得します。
     *
     * @return \ Illuminate \ Contracts \ View \ View | \ closure | string
     */
    パブリック関数render（）
    {
        return View（ 'components.table-row'）;
    }
}

コンストラクターでは、渡されたパラメーターを公共財産に割り当てます。これらのパブリックプロパティは、コンポーネントのブレードビューで自動的に利用可能になります。

3.コンポーネントビューを定義します

リソース/ビュー/コンポーネント/テーブルロウ.blade.phpファイルを開き、コンポーネントのHTML構造を書き込みます。ここでは、PHPクラスで定義されているパブリックプロパティを直接使用できます。

 {{ - リソース/ビュー/コンポーネント/Table-Row.blade.php-}}
<tr>
    <th>
        {{$ th}}
    </th>
    <td>
        
    </td>
</tr>

4.ビューでコンポーネントを使用します

これで、HTMLタグを使用するなど、任意のブレードビューでこのコンポーネントを使用できます。コンポーネントのタグ名は、そのクラス名のケバブケースバージョン（たとえば、TableRowがテーブル列になります）で、X-が付いています。

このようにして、単純な「ワンライン」挿入を実装するだけでなく、さらに重要なことに、テーブル行のHTML構造とデータ結合ロジックをカプセル化して、コードをより読みやすく、保守可能で拡張可能にします。

メモと要約

• コンポーネントと@includeオプション：
  • ブレードコンポーネント：複雑なロジックが必要なシナリオ、複数のパラメーターが受信される、またはUI要素を独立した再利用可能なユニットとして扱いたいシナリオに適しています。より強力なカプセル化、より良いセマンティクス、より明確なAPIを提供します。
  • @include：シンプルで純粋なHTMLフラグメントの再利用には、複雑なロジックや多数のパラメーターの渡されないシナリオに適しています。たとえば、固定フッターまたはヘッドナビゲーションバー。
• 命名規則：コンポーネントのクラス名は通常、Pascalcase（Tableerowなど）を使用しますが、ブレードビューのタグ名はKebab-Case（X-Table-Rowなど）を使用します。
• プロパティの合格：コンポーネントプロパティはHTML属性として直接渡すことができ、Laravelはコンポーネントクラスのコンストラクターパラメーターに自動的にマッピングされます。
• スロット：より複雑なコンポーネントの場合、任意のHTMLコンテンツを挿入する必要がある場合は、スロット（{{$ slot}}または名前付きスロット{{$ namedslot}}）を使用できます。

Laravel Bladeコンポーネントを採用することにより、開発者はUIコードを効果的に抽象化し、透明な構造を備えたフロントエンドテンプレートを構築し、維持と拡張が容易になります。これにより、開発効率が向上するだけでなく、チームのコラボレーションがよりスムーズになり、Laravelのフロントエンド開発プロセスを最適化する上で重要な実践です。

以上がLaravel Blade：コンポーネントを使用して、再利用可能なテーブル構造を効率的に構築しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。