Кои се компонентите на Ларавел и како да ги користите

Компонентите на Ларавел се напредна карактеристика, која е додадена од седмата верзија на ларавел. Во оваа статија ќе видиме што е компонента, како да се создаде, како да се користат компоненти во моделот на сечилото и како да се параметриизира компонентата со пренесување параметри.

Што е компонента Ларавел?

Компонента е дел од кодот што можеме повторно да го користиме во кој било шаблон. Тоа е нешто како делови, распореди и вклучува. На пример, го користиме истото заглавие за секој шаблон, за да можеме да создадеме компонента Header, која можеме повторно да ја користиме.

Друга употреба на компонентите за подобро разбирање е како да треба да користите копче за регистрирање на веб-локацијата на многу места како во заглавието, подножјето или на кое било друго место на веб-локацијата. Затоа креирајте компонента од кодот на тоа копче и повторно употребете го.

Како да креирате компоненти во Ларавел

На пример, ајде да создадеме компонента Header Со'Artisan:

php artisan make:component Header

Оваа команда создава две датотеки во вашиот ларавел проект:

• PHP-датотека со името Header.php внатре во директориумот app/http/View/Components;
• и HTML blade датотека со името header.blade.php внатре во директориумот resources/views/components/.

Можете исто така да креирате компоненти во поддиректориум, како што се:

php artisan make:component Forms/Button

Оваа команда ќе создаде компонента на копче во директориумот App\View\Components\Forms и blade датотеката ќе биде сместена во директориумот ресурси/прегледи/компоненти/форми.

За рендерирање на компонентата во датотеката HTML blade, ќе ја користиме оваа синтакса:

Пример за компоненти на Ларавел

Прво вметнуваме некој HTML код во датотеката header.blade.php на компонентата.

<div><h1> Header Component </h1></div>

сега креирајте датотека за преглед users.blade.php во папката средства, каде што можеме да ја користиме компонентата за заглавие.

<x-header /><h1>User Page</h1>

сега, преку системот на рутирање на laravel, го повикуваме сечилото за да го прикаже резултатот во прелистувачот

Како да пренесувате податоци до компонентите на Ларавел

За пренесување податоци на компонентата Blade се користи следнава синтакса, наведувајќи ја вредноста поврзана со параметарот внатре во елементот HTML:

<x-header message=”Utenti” />

На пример, ја користевме претходната компонента во датотеката users.blade.php.

Ти би требало defiNish ги податоците за компонентите во датотеката header.php. Сите податоци за јавните променливи беа автоматски достапни за приказот на компонентите.

Додадете го кодот во датотеката header.php внатре во директориумот на апликацијата/http/View/Components/ .

<?php

namespace App\View\Components;
use Illuminate\View\Component;

   class Header extends Component{

   /*** The alert type.** @var string*/

   public $title = "";

   public function __construct($message){

   $this->title = $message;

   }
}

Како што можете да видите, методот на конструктор на класата ја поставува променливата $title со вредноста на параметарот предадена на компонентата. Сега додадете ја променливата $title во датотеката со компоненти header.blade.php за прикажување на минати податоци.

<div> <h1> {{$title}}'s Header Component </h1> </div>

Сега овие пренесени податоци за компонентата ќе бидат прикажани во прелистувачот.

Слично на тоа, можете да ја користите оваа компонента на друга страница за визуелизација со различни податоци, со создавање друга датотека за визуелизација blade contact.blade.php и додадете го кодот на компонентата подолу за да ги прикажете поминатите податоци.

<x-header message=”Contact Us” />

Во компонентата, понекогаш треба да наведете дополнителни HTML атрибути, како што е името на класата CSS, можете директно да го додадете.

<x-header class=”styleDiv” />

Ercole Palmeri