close

Építési elrendezések Laravel – Rugalmas és karbantartható interfészek létrehozása

Az elrendezés Laravel jelentős szerepet játszik a webalkalmazás felhasználói felületének felépítésében. Az elrendezés a weboldal általános szerkezetét képviseli, beleértve az olyan gyakori részeket, mint a header, footer  és sidebar. Ebben a cikkben megvizsgáljuk, hogyan építhetünk be elrendezéseket Laravel rugalmas és karbantartható felületek létrehozásához.

Először is hozzunk létre egy alapvető elrendezést a weboldalunkhoz. app.blade.php Kezdje a könyvtárban elnevezett fájl létrehozásával. Ez a fájl a teljes webhely fő elrendezéseként szolgál majd. resources/views/layouts

Íme egy példa a app.blade.php fájl tartalmára:

<!DOCTYPE html>  
<html>  
<head>  
    <title>@yield('title')</title>  
    <link rel="stylesheet" href="{{ asset('css/app.css') }}">  
</head>  
<body>  
    <header>  
        <h1>Header</h1>  
    </header>  
  
    <nav>  
        <ul>  
            <li><a href="/">Home</a></li>  
            <li><a href="/about">About</a></li>  
            <li><a href="/contact">Contact</a></li>  
        </ul>  
    </nav>  
  
    <main>  
        @yield('content')  
    </main>  
  
    <footer>  
        <p>Footer</p>  
    </footer>  
  
    <script src="{{ asset('js/app.js') }}"></script>  
</body>  
</html>

Ebben az elrendezésben az irányelveket használjuk @yield az elrendezésen belüli dinamikus szakaszok meghatározására. Például @yield('title') lehetővé teszi a gyermeknek, hogy felülírja és beállítsa az oldal címét. Hasonlóképpen lehetővé teszi a gyermek számára, hogy beillessze az oldal fő tartalmát. views @yield('content') views

Az elrendezés létrehozása után létrehozhatunk gyermeket, amely ezt az elrendezést használja. Például egy hasonló elrendezésű oldal létrehozásához hozzon létre egy nevű fájlt a könyvtárban. Ez a fájl kiterjeszti az  elrendezést, és meghatározza az oldal konkrét tartalmát: views about about.blade.php resources/views app.blade.php about 

@extends('layouts.app')  
  
@section('title', 'About')  
  
@section('content')  
    <h2>About Page</h2>  
    <p>This is the about us page.</p>  
@endsection

A fenti példában a @extends direktívát használjuk az elrendezés öröklésére app.blade.php  . Ezután az irányelv segítségével meghatározzuk az oldal  és szakaszainak @section konkrét tartalmát  . title content

Végül meg kell határoznunk azokat az útvonalakat, amelyekkel az URL-eket a megfelelő. views

Például a fájlban routes/web.php  a következő útvonalakat adhatja hozzá:

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

Ebben a példában a „/” URL a következőhöz welcome.blade.php view, míg az /about URL a következőhöz kapcsolódik about.blade.php view.

Összefoglalva, az elrendezések beépítése Laravel lehetővé teszi, hogy megosztott felületet hozzon létre webalkalmazása számára, és kezelje az olyan általános szakaszokat, mint a header, footer és sidebar. Az elrendezések és a gyermek használatával rugalmas és karbantartható felületeket építhet a programban. views Laravel