laravel에서 탐색 모음 효과를 구현하는 방법을 설명하는 예입니다.

Laravel은 매우 인기 있는 PHP 프레임워크로, 네비게이션 바 구현이 웹 애플리케이션 구현에 없어서는 안 될 기능입니다. 이번 글을 통해 라라벨에서 네비게이션 바를 구현하는 방법을 소개하겠습니다.

1. Laravel 설치 및 구성
Laravel을 사용하여 탐색 모음을 구현하기 전에 Laravel 설치 및 구성을 완료해야 합니다. 여기서는 너무 자세히 설명하지 않겠지만, 학습이 필요한 사용자는 공식 문서를 확인해 보세요.

2. 네비게이션 바 생성
Laravel에서는 커스텀 컴포넌트를 통해 네비게이션 바를 구현할 수 있습니다. 구성 요소는 여러 번 사용할 수 있는 재사용 가능한 코드입니다. 커스텀 컴포넌트를 생성하는 방법을 살펴보겠습니다!

1. 사용자 정의 구성 요소 보기 만들기
먼저 resources/views/comComponents에 탐색 구성 요소 보기 navbar.blade.php 파일을 만듭니다. 파일에서 탐색 모음에 대한 몇 가지 기본 HTML 마크업을 추가하고 표시해야 하는 콘텐츠를 추가합니다.

<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
  <a class="navbar-brand" href="#">Laravel</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNav">
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link" href="#">Home</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">About</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Contact</a>
      </li>
    </ul>
  </div>
</nav>

이 파일에는 웹사이트에서 네비게이션 바를 쉽게 표시할 수 있도록 NAV 태그를 추가하고 스타일, 스타일 클래스 및 네비게이션 링크를 설정했습니다.

2. 사용자 정의 구성 요소 등록
이제 resources/views/comComponents 폴더에 Navbar.php라는 PHP 클래스를 생성해 보겠습니다. 이 클래스에는 뷰에서 구성 요소를 빌드하고 동시에 개인 데이터와 구성을 전달하는 데 사용되는 create 메서드가 있습니다.

<?php

namespace App\View\Components;

use Illuminate\View\Component;

class Navbar extends Component
{
    public function __construct()
    {
        //
    }

    public function render()
    {
        return view(&#39;components.navbar&#39;);
    }
}

구성 요소의 뷰가 정의되었습니다. 이제 Laravel이 구성 요소를 식별하는 방법을 알 수 있도록 구성 요소를 laravel에 등록해야 합니다.

app/Providers/AppServiceProvider.php 파일을 열고 부팅 메소드에서 뷰 컴포지터를 사용하여 구성 요소를 등록합니다.

use Illuminate\Support\Facades\Blade;
use App\View\Components\Navbar;

public function boot()
{
    Blade::component('navbar', Navbar::class);
}

이제 애플리케이션에 "navbar"라는 구성 요소가 있으므로 이를 다음과 같이 사용할 수 있습니다. 모든 보기에 마커가 있습니다.

3. 뷰에 탐색 모음 추가
이제 구성 요소가 정의되었으므로 이를 뷰에 추가해야 합니다. app/resources/views/layouts/app.blade.php 파일을 열고 다음 코드를 추가하세요:

<x-navbar />
<div class="container py-4">
  @yield('content')
</div>

navbar 구성 요소는 페이지 헤더에 포함되어 있습니다. HEAD 섹션에 추가된 이 코드 줄은 Laravel에 이 구성 요소를 삽입하도록 지시합니다. 페이지에.

4. 뷰의 탐색 모음
마지막으로 Routes/web.php 파일에 몇 가지 경로를 추가하여 간단한 웹사이트를 구축하고 여기에 탐색 모음을 추가합니다. 구체적인 코드는 다음과 같습니다

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

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

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

전체 네비게이션 바코드는 다음과 같습니다.

<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
  <a class="navbar-brand" href="#">Laravel</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNav">
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link" href="/">Home</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="/about">About</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="/contact">Contact</a>
      </li>
    </ul>
  </div>
</nav>

네비게이션 바를 성공적으로 구현한 후 웹사이트의 각 페이지 상단에서 볼 수 있어 웹사이트의 네비게이션이 더욱 고급화되고 논리가 더 명확해졌습니다.

요약
위의 사용자 정의 구성 요소를 구현하면 Laravel에서 탐색 모음을 쉽게 만들어 웹 사이트를 더 읽기 쉽고 접근 가능하게 만들 수 있습니다. Laravel 개발 초보자라도 스스로 쉽게 네비게이션 바를 구현할 수 있습니다.

위 내용은 laravel에서 탐색 모음 효과를 구현하는 방법을 설명하는 예입니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!