A Laravel összetevői egy fejlett funkció, amelyet a laravel hetedik verziója ad hozzá. Ebben a cikkben meglátjuk, mi az a komponens, hogyan kell létrehozni, hogyan kell használni a komponenseket a blade modellben, és hogyan lehet paraméterezni az összetevőt paraméterek átadásával.
A komponens egy kódrészlet, amelyet bármely sablonpengében újra felhasználhatunk. Ez olyasmi, mint a szakaszok, az elrendezések és az elemek. Például minden sablonhoz ugyanazt a fejlécet használjuk, így létrehozhatunk egy Header komponenst, amelyet újra felhasználhatunk.
Az összetevők egy másik felhasználási módja a jobb megértés érdekében az, hogy egy regisztráció gombot kell használni a webhelyen sok helyen, például a fejlécben, a láblécben vagy bárhol máshol a webhelyen. Tehát hozzon létre egy összetevőt a gombkódból, és használja újra.
Például hozzunk létre egy komponenst Header
A ... val'Artisan
:
php artisan make:component Header
Ez a parancs két fájlt hoz létre a laravel projektben:
Header.php
a könyvtáron belül app/http/View/Components
;header.blade.php
a könyvtáron belül resources/views/components/
.Alkönyvtárban is létrehozhat összetevőket, például:
php artisan make:component Forms/Button
Ez a parancs egy gombkomponenst hoz létre a könyvtárban App\View\Components\Forms
és a blade fájl az resources/views/components/forms könyvtárba kerül.
A HTML blade fájlban lévő komponens megjelenítéséhez a következő szintaxist fogjuk használni:
Először beszúrunk néhány HTML kódot a fájlba header.blade.php
az alkatrészről.
<div><h1> Header Component </h1></div>
most hozzon létre egy nézetfájlt users.blade.php
az erőforrások mappában, ahol a fejléc komponenst használhatjuk.
<x-header /><h1>User Page</h1>
most a rendszeren keresztül routing A laravelnél a blade-t hívjuk meg, hogy megjelenítse az eredményt a böngészőben
Adatok továbbítása az összetevőhöz Blade
a következő szintaxist használjuk, amely megadja az elemen belüli paraméterhez kapcsolódó értéket HTML
:
<x-header message=”Utenti” />
Például az előző komponenst használtuk a users.blade.php fájlban.
Neked kellene definish az összetevő adatait a header.php fájlban. Minden nyilvános változóadat automatikusan elérhető volt a komponensnézethez.
Adja hozzá a kódot a fájlhoz header.php az app/http/View/Components/ könyvtárban .
<?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;
}
}
Mint látható, az osztály konstruktor metódusa állítja be a változót $title
a komponensnek átadott paraméterértékkel. Most adja hozzá a változót $title
az összetevő fájlban header.blade.php
múltbeli adatok megjelenítésére.
<div> <h1> {{$title}}'s Header Component </h1> </div>
Most ezek a továbbított komponensadatok megjelennek a böngészőben.
Hasonlóképpen használhatja ezt az összetevőt egy másik vizualizációs oldalon, különböző adatokkal egy másik vizualizációs fájl létrehozásával blade
contact.blade.php
és adja hozzá az alábbi összetevőkódot az átadott adatok megjelenítéséhez.
<x-header message=”Contact Us” />
Az összetevőben néha további HTML-attribútumokat kell megadnia, például CSS-osztálynevet, közvetlenül hozzáadhatja.
<x-header class=”styleDiv” />
Ercole Palmeri
A finom motoros készségek színezéssel történő fejlesztése felkészíti a gyerekeket olyan összetettebb készségekre, mint az írás. Kiszínezni…
A haditengerészeti szektor igazi világgazdasági hatalom, amely egy 150 milliárdos piac felé navigált...
Múlt hétfőn a Financial Times bejelentette, hogy megállapodást köt az OpenAI-val. Az FT engedélyezi világszínvonalú újságírását…
Emberek milliói fizetnek a streaming szolgáltatásokért, havi előfizetési díjat fizetve. Általános vélemény, hogy Ön…