Vistas
Introducción
Por supuesto, no es práctico devolver cadenas de documentos HTML completos directamente desde tus rutas y controladores. Afortunadamente, las vistas proporcionan una forma conveniente de colocar todo nuestro HTML en archivos separados.
Las vistas separan la lógica de tu controlador/aplicación de tu lógica de presentación y se almacenan en el directorio resources/views. Al usar Laravel, las plantillas de vista generalmente se escriben usando el lenguaje de plantillas Blade. Una vista simple podría verse algo así:
<!-- Vista almacenada en resources/views/greeting.blade.php -->
<html>
<body>
<h1>Hello, {{ $name }}</h1>
</body>
</html>
Dado que esta vista se almacena en resources/views/greeting.blade.php, podemos devolverla usando el helper global view de la siguiente manera:
Route::get('/', function () {
return view('greeting', ['name' => 'James']);
});
¿Buscas más información sobre cómo escribir plantillas Blade? Consulta la documentación completa de Blade para comenzar.
Escribiendo Vistas en React / Vue
En lugar de escribir sus plantillas frontend en PHP a través de Blade, muchos desarrolladores han comenzado a preferir escribir sus plantillas usando React o Vue. Laravel hace esto sin dolor gracias a Inertia, una biblioteca que facilita conectar tu frontend de React/Vue con tu backend de Laravel sin las complejidades típicas de construir una SPA.
Nuestros kits de inicio Breeze y Jetstream te dan un excelente punto de partida para tu próxima aplicación Laravel impulsada por Inertia. Además, el Laravel Bootcamp proporciona una demostración completa de cómo construir una aplicación Laravel impulsada por Inertia, incluyendo ejemplos en Vue y React.
Creando y Renderizando Vistas
Puedes crear una vista colocando un archivo con la extensión .blade.php en el directorio resources/views de tu aplicación o usando el comando Artisan make:view:
php artisan make:view greeting
La extensión .blade.php informa al framework que el archivo contiene una plantilla Blade. Las plantillas Blade contienen HTML así como directivas Blade que te permiten fácilmente mostrar valores, crear declaraciones «if», iterar sobre datos y más.
Una vez que hayas creado una vista, puedes devolverla desde una de las rutas o controladores de tu aplicación usando el helper global view:
Route::get('/', function () {
return view('greeting', ['name' => 'James']);
});
Las vistas también pueden ser devueltas usando el facade View:
use Illuminate\Support\Facades\View;
return View::make('greeting', ['name' => 'James']);
Como puedes ver, el primer argumento pasado al helper view corresponde al nombre del archivo de vista en el directorio resources/views. El segundo argumento es una matriz de datos que debe estar disponible para la vista. En este caso, estamos pasando la variable name, que se muestra en la vista usando la sintaxis de Blade.
Directorios de Vistas Anidadas
Las vistas también pueden estar anidadas dentro de subdirectorios del directorio resources/views. Se puede usar la notación de «punto» para referenciar vistas anidadas. Por ejemplo, si tu vista se almacena en resources/views/admin/profile.blade.php, puedes devolverla desde una de las rutas/controladores de tu aplicación de la siguiente manera:
return view('admin.profile', $data);
Los nombres de los directorios de vistas no deben contener el carácter ..
Creando la Primera Vista Disponible
Usando el método first del facade View, puedes crear la primera vista que exista en una matriz dada de vistas. Esto puede ser útil si tu aplicación o paquete permite que las vistas sean personalizadas o sobrescritas:
use Illuminate\Support\Facades\View;
return View::first(['custom.admin', 'admin'], $data);
Determinando si una Vista Existe
Si necesitas determinar si una vista existe, puedes usar el facade View. El método exists devolverá true si la vista existe:
use Illuminate\Support\Facades\View;
if (View::exists('admin.profile')) {
// ...
}
Pasando Datos a las Vistas
Como viste en los ejemplos anteriores, puedes pasar una matriz de datos a las vistas para que esos datos estén disponibles en la vista:
return view('greetings', ['name' => 'Victoria']);
Al pasar información de esta manera, los datos deben ser una matriz con pares clave/valor. Después de proporcionar datos a una vista, puedes acceder a cada valor dentro de tu vista usando las claves de los datos, como <?php echo $name; ?>.
Como alternativa a pasar una matriz completa de datos a la función helper view, puedes usar el método with para agregar piezas individuales de datos a la vista. El método with devuelve una instancia del objeto de vista para que puedas seguir encadenando métodos antes de devolver la vista:
return view('greeting')
->with('name', 'Victoria')
->with('occupation', 'Astronaut');
Compartiendo Datos con Todas las Vistas
Ocasionalmente, puedes necesitar compartir datos con todas las vistas que son renderizadas por tu aplicación. Puedes hacerlo usando el método share del facade View. Normalmente, debes colocar las llamadas al método share dentro del método boot de un proveedor de servicios. Eres libre de agregarlos a la clase App\Providers\AppServiceProvider o generar un proveedor de servicios separado para albergarlos:
<?php
namespace App\Providers;
use Illuminate\Support\Facades\View;
class AppServiceProvider extends ServiceProvider
{
/**
* Registrar cualquier servicio de la aplicación.
*/
public function register(): void
{
// ...
}
/**
* Inicializar cualquier servicio de la aplicación.
*/
public function boot(): void
{
View::share('key', 'value');
}
}
Compositores de Vistas
Los compositores de vistas son callbacks o métodos de clase que se llaman cuando se renderiza una vista. Si tienes datos que deseas vincular a una vista cada vez que se renderiza esa vista, un compositor de vistas puede ayudarte a organizar esa lógica en una sola ubicación. Los compositores de vistas pueden ser particularmente útiles si la misma vista es devuelta por múltiples rutas o controladores dentro de tu aplicación y siempre necesita una pieza particular de datos.
Normalmente, los compositores de vistas se registrarán dentro de uno de los proveedores de servicios de tu aplicación. En este ejemplo, asumiremos que el App\Providers\AppServiceProvider albergará esta lógica.
Usaremos el método composer del facade View para registrar el compositor de vistas. Laravel no incluye un directorio predeterminado para compositores de vistas basados en clases, por lo que eres libre de organizarlos como desees. Por ejemplo, podrías crear un directorio app/View/Composers para albergar todos los compositores de vistas de tu aplicación:
<?php
namespace App\Providers;
use App\View\Composers\ProfileComposer;
use Illuminate\Support\Facades;
use Illuminate\Support\ServiceProvider;
use Illuminate\View\View;
class AppServiceProvider extends ServiceProvider
{
/**
* Registrar cualquier servicio de la aplicación.
*/
public function register(): void
{
// ...
}
/**
* Inicializar cualquier servicio de la aplicación.
*/
public function boot(): void
{
// Usando compositores basados en clases...
Facades\View::composer('profile', ProfileComposer::class);
// Usando compositores basados en closures...
Facades\View::composer('welcome', function (View $view) {
// ...
});
Facades\View::composer('dashboard', function (View $view) {
// ...
});
}
}
Ahora que hemos registrado el compositor, el método compose de la clase App\View\Composers\ProfileComposer se ejecutará cada vez que se renderice la vista profile. Veamos un ejemplo de la clase del compositor:
<?php
namespace App\View\Composers;
use App\Repositories\UserRepository;
use Illuminate\View\View;
class ProfileComposer
{
/**
* Crear un nuevo compositor de perfil.
*/
public function __construct(
protected UserRepository $users,
) {}
/**
* Vincular datos a la vista.
*/
public function compose(View $view): void
{
$view->with('count', $this->users->count());
}
}
Como puedes ver, todos los compositores de vistas se resuelven a través del contenedor de servicios, por lo que puedes hacer type-hint de cualquier dependencia que necesites dentro del constructor de un compositor.
Adjuntando un Compositor a Múltiples Vistas
Puedes adjuntar un compositor de vistas a múltiples vistas a la vez pasando una matriz de vistas como el primer argumento al método composer:
use App\Views\Composers\MultiComposer;
use Illuminate\Support\Facades\View;
View::composer(
['profile', 'dashboard'],
MultiComposer::class
);
El método composer también acepta el carácter * como comodín, lo que te permite adjuntar un compositor a todas las vistas:
use Illuminate\Support\Facades;
use Illuminate\View\View;
Facades\View::composer('*', function (View $view) {
// ...
});
Creadores de Vistas
Los «creadores» de vistas son muy similares a los compositores de vistas; sin embargo, se ejecutan inmediatamente después de que la vista se instancia en lugar de esperar hasta que la vista esté a punto de renderizarse. Para registrar un creador de vistas, usa el método creator:
use App\View\Creators\ProfileCreator;
use Illuminate\Support\Facades\View;
View::creator('profile', ProfileCreator::class);
Optimizando Vistas
Por defecto, las vistas de plantillas Blade se compilan bajo demanda. Cuando se ejecuta una solicitud que renderiza una vista, Laravel determinará si existe una versión compilada de la vista. Si el archivo existe, Laravel determinará si la vista no compilada ha sido modificada más recientemente que la vista compilada. Si la vista compilada no existe, o la vista no compilada ha sido modificada, Laravel recompilará la vista.
Compilar vistas durante la solicitud puede tener un pequeño impacto negativo en el rendimiento, por lo que Laravel proporciona el comando Artisan view:cache para precompilar todas las vistas utilizadas por tu aplicación. Para un mayor rendimiento, puedes desear ejecutar este comando como parte de tu proceso de despliegue:
php artisan view:cache
Puedes usar el comando view:clear para limpiar la caché de vistas:
php artisan view:clear
Mi cuenta de Google