Laravel | Herencia de plantillas Blade

Un motor de plantillas facilita la escritura del código frontend y ayuda a reutilizar el código. Todos los archivos blade tienen una extensión de *.blade.php . En Laravel, la mayoría de las veces los archivos de interfaz se almacenan en el directorio de recursos/vistas . Los archivos Blade son compatibles con PHP y se compilan en PHP simple y se almacenan en caché en el servidor para que no tengamos que hacer el trabajo adicional de compilar las plantillas nuevamente cuando un usuario accede a una página nuevamente, por lo que usar Blade es tan eficiente como usar archivos PHP. en sí mismo en la interfaz.

Herencia de plantilla: en la mayoría de las páginas web modernas, se sigue un tema fijo en todas las páginas web. Por lo tanto, es muy efectivo poder reutilizar su código para que no tenga que volver a escribir las partes repetitivas en su código y Blade lo ayuda enormemente a lograrlo.

  • Definición de un diseño: Hagámoslo con un ejemplo y creemos un archivo llamado layout.blade.php en el directorio de recursos/vistas como se muestra a continuación:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <title>@yield('title')</title>
    </head>
    <body>
        <div>
            @yield('content')
        </div>
    </body>
    </html>

    Ahora, en el código anterior, usamos la directiva @yield para decirle al Blade que vamos a ampliar aún más esta parte en las páginas secundarias del Blade. Además, observe que cada una de las directivas de rendimiento tiene un nombre como título para la primera y contenido para la segunda. Estos nombres se usarán más adelante en la página secundaria para indicar que esta sección se extiende aquí.

  • Extender un diseño: Hagámoslo también ahora y creemos una página en el directorio de recursos/vistas llamada mypage.blade.php como se indica a continuación:

    @extends('layout')
      
    @section('title')
        Child Page
    @endsection
      
    @section('content')
        <h1>My first page with Blade Inheritance.</h1>
    @endsection

    En este código, primero usamos la directiva @extends que indica de qué página blade heredamos esta página. En nuestro caso, será el diseño, ya que heredaremos esta página de layout.blade.php , que creamos anteriormente. Además, usamos la directiva @section para extender cada una de las directivas @yield del archivo blade principal. Tenemos que decir el nombre de cada directiva @yield que estamos extendiendo aquí en la directiva @section como lo hemos hecho en el código anterior. Después de escribir el código, asegúrese de finalizar la directiva con @endsection . Todo el @rendimientoLas secciones se reemplazarán con el código respectivo en las páginas de hoja secundaria. Una última cosa que queda para que esto funcione es agregar una ruta como se indica a continuación en tus rutas/web.php .

    Route::get('/mypage', function() {
        return view('mypage');
    });

    Acabamos de crear una ruta a /mypage y en la función de devolución de llamada estamos sirviendo mypage.blade.php . Tenga en cuenta que Blade busca archivos automáticamente en el directorio de recursos/vistas .

  • Producción:
  • En el resultado, puede ver cómo @yield(‘title’) se reemplaza con Child Page y @yield(‘content’) se reemplaza con My first page with Blade Inheritance.

Publicación traducida automáticamente

Artículo escrito por gurrrung y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *