Lección 12 de 45 12 min de lectura

Directivas de Blade

Las directivas son instrucciones especiales de Blade que empiezan con @. Te permiten usar condicionales, bucles y otras estructuras de control en tus vistas.

¿Qué son las directivas?

Las directivas son funciones especiales de Blade que empiezan con @. Reemplazan las estructuras de control de PHP con una sintaxis más limpia.

Condicionales: @if

La directiva @if funciona igual que el if de PHP:

blade
@if ($age >= 18)
    <p>Eres mayor de edad</p>
@elseif ($age >= 13)
    <p>Eres adolescente</p>
@else
    <p>Eres menor de edad</p>
@endif

Condicionales: @unless

@unless es lo contrario de @if. Se ejecuta si la condición es falsa:

blade
@unless ($user === null)
    <p>Bienvenido, {{ $user }}</p>
@endunless

Comprobar existencia: @isset y @empty

blade
{{-- Se ejecuta si $name existe y no es null --}}
@isset($name)
    <p>Hola, {{ $name }}</p>
@endisset

{{-- Se ejecuta si $posts está vacío --}}
@empty($posts)
    <p>No hay posts</p>
@endempty

Bucle: @foreach

@foreach itera sobre arrays o colecciones:

blade
<ul>
    @foreach ($users as $user)
        <li>{{ $user }}</li>
    @endforeach
</ul>

Bucle con índice: @foreach + $loop

Dentro de @foreach tienes acceso a la variable $loop:

blade
@foreach ($users as $user)
    {{ $loop->index }}    {{-- 0, 1, 2... --}}
    {{ $loop->iteration }} {{-- 1, 2, 3... --}}
    {{ $loop->first }}     {{-- true si es el primero --}}
    {{ $loop->last }}      {{-- true si es el último --}}
    {{ $loop->count }}     {{-- total de elementos --}}
@endforeach

Bucle con caso vacío: @forelse

@forelse combina @foreach con un caso para cuando el array está vacío:

blade
@forelse ($posts as $post)
    <p>{{ $post }}</p>
@empty
    <p>No hay posts disponibles</p>
@endforelse

Bucle: @for y @while

blade
@for ($i = 0; $i < 5; $i++)
    <p>Iteración {{ $i }}</p>
@endfor

@while ($condition)
    <p>Mientras sea true...</p>
@endwhile
@forelse es tu amigo

Usa @forelse en lugar de @foreach cuando quieras mostrar un mensaje si no hay elementos.

Ejercicios

Ejercicio 1: Lista condicional

Crea una vista que reciba un array $items. Si el array tiene elementos, muéstralos en una lista <ul>. Si está vacío, muestra "No hay elementos".

Ver solución
@forelse ($items as $item)
    <ul>
        <li>{{ $item }}</li>
    </ul>
@empty
    <p>No hay elementos</p>
@endforelse

Ejercicio 2: Usar $loop

Crea una vista que muestre una lista de usuarios. El primer usuario debe tener la clase CSS first y el último la clase last.

Ver solución
<ul>
    @foreach ($users as $user)
        <li class="@if($loop->first) first @endif @if($loop->last) last @endif">
            {{ $user }}
        </li>
    @endforeach
</ul>

Ejercicio 3: Condicional de edad

Crea una vista que reciba $age y muestre "Menor", "Adulto" o "Senior" según sea menor de 18, entre 18-65, o mayor de 65.

Ver solución
@if ($age < 18)
    <p>Menor</p>
@elseif ($age <= 65)
    <p>Adulto</p>
@else
    <p>Senior</p>
@endif

Resumen

  • @if, @elseif, @else, @endif para condicionales
  • @unless ejecuta si la condición es falsa
  • @isset y @empty comprueban existencia
  • @foreach itera sobre arrays
  • $loop da información del bucle (index, first, last, count)
  • @forelse combina foreach con caso vacío
  • @for y @while para bucles tradicionales

¿Te está gustando el curso?

Tenemos cursos premium con proyectos reales, soporte personalizado y certificado.

Descubrir cursos premium