close

Δημιουργία διατάξεων κτιρίου με Laravel- Δημιουργία ευέλικτων και συντηρήσιμων διεπαφών

Στο Laravel, η διάταξη παίζει σημαντικό ρόλο στη δημιουργία της διεπαφής χρήστη για μια εφαρμογή Ιστού. Μια διάταξη αντιπροσωπεύει τη συνολική δομή μιας ιστοσελίδας, συμπεριλαμβανομένων κοινών ενοτήτων όπως το header, footer  και sidebar. Σε αυτό το άρθρο, θα διερευνήσουμε τον τρόπο δημιουργίας διατάξεων για Laravel τη δημιουργία ευέλικτων και διατηρήσιμων διεπαφών.

Αρχικά, ας δημιουργήσουμε μια βασική διάταξη για τον ιστότοπό μας. Ξεκινήστε δημιουργώντας ένα αρχείο με όνομα app.blade.php στον κατάλογο. Αυτό το αρχείο θα χρησιμεύσει ως η κύρια διάταξη για ολόκληρο τον ιστότοπο. resources/views/layouts

Ακολουθεί ένα παράδειγμα περιεχομένου για το 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>

Σε αυτή τη διάταξη, χρησιμοποιούμε τις @yield οδηγίες για να ορίσουμε δυναμικές ενότητες μέσα στη διάταξη. Για παράδειγμα, @yield('title') επιτρέπει στο παιδί να παρακάμψει και να ορίσει τον τίτλο της σελίδας. Ομοίως, επιτρέπει στο παιδί να εισάγει το κύριο περιεχόμενο της σελίδας. views @yield('content') views

Μόλις δημιουργηθεί η διάταξη, μπορούμε να δημιουργήσουμε παιδί που να χρησιμοποιεί αυτήν τη διάταξη. Για παράδειγμα, για να δημιουργήσετε μια σελίδα με παρόμοια διάταξη, δημιουργήστε ένα αρχείο με το όνομα στον κατάλογο. Αυτό το αρχείο θα επεκτείνει τη  διάταξη και θα ορίσει συγκεκριμένο περιεχόμενο για τη σελίδα: 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

Στο παραπάνω παράδειγμα, χρησιμοποιούμε την @extends οδηγία για να κληρονομήσουμε τη app.blade.php  διάταξη. Στη συνέχεια, χρησιμοποιούμε την @section οδηγία για να ορίσουμε το συγκεκριμένο περιεχόμενο για τις title  και content  ενότητες της σελίδας.

Τέλος, πρέπει να ορίσουμε τις διαδρομές για τη σύνδεση των διευθύνσεων URL με τα αντίστοιχα. views

Για παράδειγμα, στο routes/web.php  αρχείο, μπορείτε να προσθέσετε τις ακόλουθες διαδρομές:

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

Σε αυτό το παράδειγμα, το URL "/" συνδέεται με το welcome.blade.php view, ενώ το /about URL συνδέεται με το about.blade.php view.

Συμπερασματικά, το κτίριο layouts in Laravel σάς επιτρέπει να δημιουργήσετε μια κοινόχρηστη διεπαφή για την εφαρμογή Ιστού σας και να διαχειριστείτε κοινές ενότητες όπως το header, footer και sidebar. Χρησιμοποιώντας διατάξεις και παιδιά, μπορείτε να δημιουργήσετε ευέλικτες και διατηρούμενες διεπαφές στο. views Laravel