close

Bygg oppsett med Laravel- Lage fleksible og vedlikeholdbare grensesnitt

I Laravel, spiller layout en betydelig rolle i å bygge brukergrensesnittet for en nettapplikasjon. Et oppsett representerer den generelle strukturen til en nettside, inkludert vanlige seksjoner som header, footer  og sidebar. I denne artikkelen vil vi utforske hvordan du bygger oppsett for Laravel å lage fleksible og vedlikeholdbare grensesnitt.

La oss først lage en grunnleggende layout for nettstedet vårt. Start med å lage en fil som heter app.blade.php i katalogen. Denne filen vil fungere som hovedoppsettet for hele nettstedet. resources/views/layouts

Her er et eksempel på innhold for app.blade.php filen:

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

I denne layouten bruker vi @yield direktivene til å definere dynamiske seksjoner i layouten. @yield('title') Lar barnet for eksempel overstyre og angi sidetittelen. På samme måte lar barnet sette inn hovedinnholdet på siden. views @yield('content') views

Når layouten er opprettet, kan vi lage barn som bruker denne layouten. For å lage en side med et lignende oppsett, oppretter du for eksempel en fil med navn i katalogen. Denne filen vil utvide  layouten og definere spesifikt innhold for siden: 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

I eksemplet ovenfor bruker vi @extends direktivet til å arve app.blade.php  oppsettet. Deretter bruker vi @section direktivet til å definere det spesifikke innholdet for title  og content  delene av siden.

Til slutt må vi definere rutene for å koble URL-ene til de respektive. views

For eksempel, i routes/web.php  filen kan du legge til følgende ruter:

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

I dette eksemplet er "/"-URL-en koblet til welcome.blade.php view, mens /about URL-en er koblet til about.blade.php view.

Avslutningsvis lar byggeoppsett i Laravel deg lage et delt grensesnitt for nettapplikasjonen din og administrere vanlige seksjoner som header, footer og sidebar. Ved å bruke oppsett og underordnet kan du bygge fleksible og vedlikeholdbare grensesnitt i. views Laravel