close

Rakenna asetteluja Laravel- Joustavien ja ylläpidettävien käyttöliittymien luominen

Asettelulla Laravel on merkittävä rooli verkkosovelluksen käyttöliittymän rakentamisessa. Asettelu edustaa verkkosivun yleistä rakennetta, mukaan lukien yleiset osiot, kuten header, footer  ja sidebar. Tässä artikkelissa tutkimme, kuinka luoda asetteluja Laravel joustavien ja ylläpidettävien käyttöliittymien luomiseksi.

Ensin luodaan verkkosivustollemme perusasettelu. app.blade.php Aloita luomalla hakemistoon nimetty tiedosto. Tämä tiedosto toimii koko verkkosivuston pääasetteluna. resources/views/layouts

Tässä on esimerkki tiedoston sisällöstä app.blade.php:

<!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>

Tässä asettelussa käytämme direktiivejä @yield dynaamisten osien määrittämiseen asettelun sisällä. @yield('title') Antaa lapsen esimerkiksi ohittaa ja asettaa sivun otsikon. Samoin antaa lapsen lisätä sivun pääsisällön. views @yield('content') views

Kun asettelu on luotu, voimme luoda lapsen, joka käyttää tätä asettelua. Jos haluat esimerkiksi luoda sivun, jolla on samanlainen asettelu, luo hakemistoon nimetty tiedosto. Tämä tiedosto laajentaa asettelua  ja määrittää sivulle tietyn sisällön: 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

Yllä olevassa esimerkissä käytämme direktiiviä @extends asettelun perimiseksi app.blade.php  . Seuraavaksi käytämme direktiiviä @section määrittämään tietyn sisällön sivun title  ja content  -osioille.

Lopuksi meidän on määritettävä reitit URL-osoitteiden linkittämiseksi vastaaviin. views

Voit esimerkiksi routes/web.php  lisätä tiedostoon seuraavat reitit:

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

Tässä esimerkissä URL-osoite "/" on linkitetty osoitteeseen welcome.blade.php view, kun taas /about URL-osoite on linkitetty osoitteeseen about.blade.php view.

Lopuksi voidaan todeta, että asettelujen luominen Laravel mahdollistaa jaetun käyttöliittymän luomisen verkkosovelluksellesi ja yleisten osien, kuten, header ja footer, hallinnan sidebar. Asetteluja ja lapsia käyttämällä voit rakentaa joustavia ja ylläpidettäviä käyttöliittymiä. views Laravel