En esta entrada vamos a profundizar en Blade. Vamos a crear un layout y extenderlo desde los diferentes templates, también vamos a utilizar includes para incluir desde una vista a parte los errores y el formulario de envío de posts. Y también utilizaremos los condicionales de Blade para mostrar un mensaje si no hay posts en la lista.
Layout y extenderlo
Un layout es una plantilla padre que puede contener un header, footer, etc. común para varias vistas. Esto nos evita la tarea de escribir lo mismo varias veces, solamente con escribirlo una vez y dinamizando lo que no se comparte (título, links activos del menú, etc.), ya estaría todo.
Creamos un fichero en resources/views que se llame layout.blade.php y contendrá lo siguiente:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<html> <head> <title>Laravel Blog</title> </head> <body> <header> this is a header </header> <div id="container"> @yield('content') </div> <footer> this is a footer </footer> </body> </html> |
Y ahora lo extendemos en nuestras vistas (posts.blade.php y post.blade.php). Quedarían así:
|
1 2 3 4 5 |
@extends('layout') @section('content') //todo el código @endsection |
Lo que hace es en el div con id container añadir el código que está en @section(‘content’).
Includes
Ahora vamos a separar el formulario de envío de posts y la sección de errores en vistas separadas, para si se diese el caso poder reutilizarlas sin tener que volver a escribir el mismo código.
Cogemos el código del formulario que está en posts.blade.php y lo ponemos en un archivo separado:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<form id="save_post" method="post" action="{{URL::to('/')}}/posts"> {{ csrf_field() }} <div> <p>Title</p> <input type="text" id="title" name="title" value="{{ old('title') }}"> </div> <div> <p>Body</p> <textarea id="body" name="body">{{ old('body') }}</textarea> </div> <div> <input type="submit" value="Save"> </div> </form> |
Y hacemos lo mismo con los errores:
|
1 2 3 4 5 6 7 8 9 |
@if ($errors->any()) <div> <ul> @foreach ($errors->all() as $error) <li>{{ $error }}</li> @endforeach </ul> </div> @endif |
En posts.blade.php deberemos sustituir lo que acabamos de copiar en las vistas nuevas por:
|
1 2 |
@include('includes.errors') @include('includes.form-submit-post') |
Con todo esto ya estamos incluyendo las nuevas vistas desde otras separadas. También podríamos reutilizarlas en otras vistas si es necesario, simplemente con los @include.
Detectar si hay posts que mostrar
Para detectar si hay posts que mostrar y si no hay mostrar un mensaje, deberemos modificar el bucle foreach de posts.blade.php y utilizar otra instrucción llamada forelse.
|
1 2 3 4 5 6 |
@forelse ($posts as $post) <p>{{ $post->title }}</p> <a href="{{URL::to('/')}}/post/{{ $post->id }}">Go</a> @empty <p>No posts</p> @endforelse |
Hay otras maneras de hacer lo mismo, por ejemplo con un if que cuente cuantos posts hay y si hay 0 que muestre el mensaje y si hay más que muestre los posts.
|
1 2 3 4 5 |
@if (count($posts) === 0) //no posts @else //foreach posts @endif |
Blade es muy extenso, si quieres mirar más cosas sobre él, te dejo aquí el enlace a la documentación.
En la siguiente entrada, tratemos un poco más en profundidad Eloquent ORM.
Si hay cualquier tipo de error en el post o te surge cualquier duda, no dudes en ponerlo en los comentarios o enviarme un correo desde la página de contacto.
CONTACTAR
Hola, despues de estas modificaciones ya no guarda posts, le doy clic en el boton Save y solo me manda una pagina en blanco. Ojala me pudieras ayudar, soy nueva en esto.
Hola Laura, gracias por tu comentario!
Te muestra algún error?