Vistas

icon picker
Vistas en Laravel: blade

Las vistas en php se pueden construir mezclando php y html.
Ese código híbrido puede resultar muy espeso y difícil de entender.
Por ese motivo se ha extendido el uso de motores de plantillas que facilitan la inclusión de contenido variable en nuestro html.
Motores de plantillas son:
Blade, usado por Laravel
Smarty, muy habitual, no ceñido a ningún framework
Twig, usado por Simphony.
Los motores de plantillas usan un código más limpio. Dicho código se compila de forma transparente al usuario y se genera php como estamos acostumbrados.
plantilla + compilación transparente = html + php

Mostrar una vista.

Las vistas en Laravel pueden usar php o el motor blade. El nombre del fichero nos indica cómo hemos construido una vista. Hemos de respetar esta convención para que blade funcione.
nombrevista.php
nombrevista.blade.php
Desde nuestro fichero de rutas podemos llamar a una vista. Veremos que también lo podemos hacer desde los controladores.
Las vistas se guardan en /resources/views
Route::get('user', function()
{
//mostraremos user.php o user.blade.php
return view('user');
});
Es conveniente usar subdirectorios. No obstante al llamarlas podemos usar barras o puntos para referirnos a ellas.
La vista guardada en user/index.blade.php se puede llamar indistintamente así:
Route::get('user', function()
{
return view('user/index');
return view('user.index');
});

Pasar variables a la vista

Para llevar variables a la vista debemos hacer lo siguiente:
return view('grupo.vista', $arrayAsociativo);
Ejemplos:
return view('user.index', ['name' => 'James']);

return view('blog.history', [
'mes' => $mes,
'ano' => $ano,
'posts' => $posts
]);
Existen otras variantes:
Con with:
return view('greeting')->with('name', 'Victoria');
Y por último usando compact.
return view('users', compact('mes', 'ano', 'posts'));

//equivale a:

return view('blog.history', [
'mes' => $mes,
'ano' => $ano,
'posts' => $posts
]);

Mostrar datos

El método más básico que tenemos en Blade es el de mostrar datos, para esto utilizaremos las llaves dobles ({{ }}) y dentro de ellas escribiremos la variable o función con el contenido a mostrar:
Hola {{ $name }}.
La hora actual es {{ time() }}.

Como hemos visto podemos mostrar el contenido de una variable o incluso llamar a una función para mostrar su resultado. Blade se encarga de escapar el resultado llamando a htmlentities para prevenir errores y ataques de tipo XSS. Si en algún caso no queremos escapar los datos tendremos que usar {!! !!} en vez de {{ }}:
Hola {!! $name !!}.

Nota: En general siempre tendremos que usar las llaves dobles, en especial si vamos a mostrar datos que son proporcionados por los usuarios de la aplicación. Esto evitará que inyecten símbolos que produzcan errores o inyecten código javascript que se ejecute sin que nosotros queramos. Por lo tanto, este último método solo tenemos que utilizarlo si estamos seguros de que no queremos que se escape el contenido.

Mostrar un dato sólo si existe

Para comprobar que una variable existe o tiene un determinado valor podemos utilizar el operador ternario de la forma:
{{ isset($name) ? $name : 'Valor por defecto' }}
O simplemente usar la notación que incluye Blade para este fin:
{{ $name or 'Valor por defecto' }}

Comentarios

Para escribir comentarios en Blade se utilizan los símbolos {{-- y --}}, por ejemplo:
{{-- Este comentario no se mostrará en HTML --}}

Pasar información

Lo habitual es pasar información a la plantilla para que se genere una vista realmente dinámica. Para hacerlo usando un array asociativo (clave-valor).
Ejemplo con un dato
Route::get('user', function()
{
return view('user.index', ['name' => 'James']);
});
O así si hay más de uno.
view('blog.history', [
'mes' => $mes,
'ano' => $ano,
'posts' => $posts
]);
O también con with:
return view('greeting')->with('name', 'Victoria');
Y por último usando compact:
return view('users', compact('users', 'title'));

Haciendo echo:
//modo php
<?php echo $variable ?>
//modo blade
{{ $variable }}
Los textos son "escapados siempre". Es una medida de seguridad importante cuando tomamos datos de formularios de usuario.
Para no hacerlo debemos usar '{!! $var !!}'
Route::get('escape', function () {
return view('user.escape', [
'text' => '<h1>hola mundo</h1>'
]);
});
Crea la siguiente vista con nombre escape.blade.php:
<!DOCTYPE html>
<html>
<head>
<title>User</title>
</head>
<body>
Texto "escapado"{{ $text }}
<br>
Texto sin escapar: {!! $text !!}
</body>
</html>
Podemos usar el operador ternario:
//al estilo php
{{ isset($name) ? $name : 'Default' }}

//o al modo blade
{{ $name or 'Default'}}

Estructuras de control.-

Blade nos permite utilizar la estructura if de las siguientes formas:
@if( count($users) === 1 )
Solo hay un usuario!
@elseif (count($users) > 1)
Hay muchos usuarios!
@else
No hay ningún usuario :(
@endif
//además contamos con un si negativo (if(!condicion){})
@unless (Auth::check())
You are not signed in.
@endunless
En los siguientes ejemplos se puede ver como realizar bucles tipo for, while o foreach:
Bucles
@for ($i = 0; $i < 10; $i++)
El valor actual es {{ $i }}
@endfor

@foreach ($users as $user)
<p>Usuario {{ $user->name }} con identificador: {{ $user->id }}</p>
@endforeach

@forelse ($users as $user)
<li>{{ $user->name }}</li>
@empty
<p>No Usuarios</p>
@endforelse

@while (true)
<p>Soy un bucle while infinito!</p>
@endwhile
Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.