Kontakt aufnehmen

BladeX von Spatie

BladeX ist eine Art Erweiterung der Blade Template Engine in Laravel. Es ändert die Funktionalität von Blade aber nicht sondern agiert lediglich als syntaktischer Zucker, der das Schreiben und Nutzen von Blade-Komponenten vereinfachen soll.
Wesentliche Neuerungen gibt es - außer einer alternativen Schreibweise für Komponenten - nicht.

BladeX installieren

BladeX lässt sich über Composer installieren:
composer require spatie/laravel-blade-x

Eine Komponente mit BladeX erstellen

Wie sich wiederverwendbare Blade-Komponenten erstellen lassen haben wir bereits in diesem Artikel erklärt. BladeX-Komponenten unterscheiden sich im Wesentlichen nur durch die Art ihrer Einbindung von gewöhnlichen Blade-Komponenten. Die Syntax erinnert dabei stark an Vue.js.

<meine-neue-komponente title="Hallo!" :strings=$myStrings></meine-neue-komponente>

Wir haben der Komponente oben zwei Werte als Parameter (title und strings) übergeben. Es ist nur wichtig darauf zu achten, dass bei Parametern, deren Werte als Variablen übergeben werden, die vorangehenden Doppelpunkte nicht fehlen (:strings=$myStrings).

Die Komponente selbst sieht dann so aus:

<div>
    <h2>{{$title}}</h2>
    @foreach($strings as $string)
    <p>{{$string}}</p>
    @endforeach
</div>

Komponenten registrieren

BladeX-Komponenten müssen im Gegensatz zu herkömmlichen Blade-Komponenten vor ihrer Verwendung registriert werden. Das erfolgt in der boot-Methode in app/Providers/AppServiceProvider.php:

BladeX::component('components.meineNeueKomponente');

Komfortabler ist es, hier ganze Ordner per '*'-Selektor zu registrieren:

BladeX::component('components.*');

Laravel Entwickler gesucht?

Wir haben bereits viel Erfahrung im Umgang mit Laravel und Vue.js.
Nehmen Sie gerne unverbindlich Kontakt zu uns auf.

zum Angebot

Du arbeitest in einer Agentur oder als Freelancer?
Dann wirf doch mal einen Blick auf unsere Software FeatValue.

Über uns

Stefan Wienströer

Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project

Cookie-Einstellungen

Helfen Sie dabei, uns noch besser zu machen. Wir nutzen Cookies und ähnliche Technologien, um die Website auf Ihre Bedürfnisse anzupassen. Zur Datenschutzerklärung

Auswahl speichern