Laravel cơ bản
Laravel nâng cao
Quảng cáo

View Trong Laravel

Trong hướng dẫn này các bạn sẽ học cách sử dụng View trong Laravel 8.

Qua những bài về Route trong Laravel các bạn có thể thấy rằng chúng ta có thể trả về mã HTML luôn, nhưng nếu làm vậy thì code sẽ không gọn gàng mà sẽ rất rối rắm, vì vậy để dễ quản lý thì bạn cần phải đưa vào view để quản lý.

1. Tạo view trong Laravel

Trong Laravel, mặc định các view sẽ được đặt trong thư mục resources/views. Nếu như bạn muốn thay đổi thư mục bạn có thể vào config/view.php thay đổi lại giá trị của paths.

Mặc định Laravel hỗ trợ view file có đuôi là .html, .php, .css , .blade.php. Nếu trong thư mục có cùng các view trùng tên thì Laravel sẽ ưu tiên theo thứ tự như sau: .blade.php , .php, .css, .html.

VD: Mình sẽ tạo view có tên là home.html với nội dung như sau:

Ví dụ

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>VZN.vn</title>
</head>
<body>
<h1>Hello world!</h1>
</body>
</html>


2. Render view trong Laravel.

Để render view trong Laravel các bạn có thể sử dụng hàm view() hoặc View::make() với cú pháp sau:

view($view, $data);

Hoặc

use \Illuminate\Support\Facades\View;

View::make($view, $data);

Trong đó:

- $view là path đến view (tính từ thư mục views).
- $data là mảng data bạn muốn truyền vào trong view. Tham số này có thể bỏ trống.

VD: Mình sẽ render view home.html trong ví dụ trên.

Ví dụ

/* routes/web.php */

use Illuminate\Support\Facades\Route;

Route::get('/', function () {
    return view('home');
})->name('home');

VD: Mình sẽ tạo một view và truyền data vào trong.

- file resources/views/home.php.

Ví dụ

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title><?=$title?></title>
</head>
<body>
<h1><?=$body?></h1>
</body>
</html>

- file routes/web.php.

Ví dụ

/* routes/web.php */
use Illuminate\Support\Facades\Route;

Route::get('/', function () {
    return view('home', ['title' => 'VZN.vn', 'body' => 'Body']);
})->name('home');

Nếu trong trường hợp view của bạn nằm trong một thư mục con của thư mục resources/views thì bạn có thể sử dụng dấu . để đại diện cho kí tự /.

VD: Với file view resources/views/home/index.php thì render sẽ như sau:

Ví dụ

/* routes/web.php */
use Illuminate\Support\Facades\Route;

Route::get('/', function () {
    return view('home.index', ['title' => 'VZN.vn', 'body' => 'Body']);
})->name('home');

3. View first trong Laravel.

Trong một số trường hợp bạn muốn render ra view tồn tại đầu tiên trong danh sách view thì bạn có thể sử dụng phương thức first trong View object với cú pháp như sau:

use Illuminate\Support\Facades\View;

View::first($views, $data);

Trong đó:

- $views là mảng path đến view (tính từ thư mục views).
- $data là mảng data bạn muốn truyền vào trong view. Tham số này có thể bỏ trống.

Ví dụ

use Illuminate\Support\Facades\View;

return View::first(['custom.admin', 'admin'], $data);

4. Kiểm tra view tồn tại trong Laravel.

Để check xem một view có tồn tại hay không các bạn sử dụng phương thức exists với cú pháp như sau:

use Illuminate\Support\Facades\View;

View::exists($view):

Trong đó: $view là path đến view bạn muốn check.

VD: Kiểm tra xem thư mục views có view nào tên home không.

Ví dụ

use Illuminate\Support\Facades\View;

if (View::exists('home')) {
   // tồn tại
}

5. Truyền data cho tất cả view.

Trong Laravel để truyền view cho tất cả các view các bạn có thể sử dụng phương thức share trong View object. Để cho ứng dụng được hoạt động tốt và chính xác nhất bạn nên đưa view share vào trong provider.

VD: mình sẽ share data có name là siteTitle cho tất cả các view trong Laravel.

- file Providers/AppServiceProvider.php.

Ví dụ

<?php

namespace App\Providers;

use Illuminate\Support\Facades\View;
use Illuminate\Support\ServiceProvider;

class AppServiceProvider extends ServiceProvider
{
    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }

    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        View::share('siteTitle', 'VZN.vn');
    }
}

Lúc này bạn có thể sử dụng biến $siteTitle trong tất cả các view.

6. View composer.


View composer là một class hoặc một callback nó sẽ được gọi khi view render. Nếu bạn muốn đưa data vào view khi render thì View composer cũng là một giải pháp dành cho bạn.

Trong một số trường hợp nhiều view cần dùng chung một đoạn logic (nhưng không phải tất cả) và truyền vào view thì bạn nên sử dụng view composer cho code đỡ bị lặp lại.

Bạn cần đăng kí view composer vào trong provider để cho Laravel biết. Và Laravel có cung cấp cho chúng ta có hai cách để khai báo view composer đó là dùng closure hoặc là class

Đối với view composer dùng closure thì bạn chỉ việc khai báo theo cú pháp sau:

View::composer($views, function ($view) {
//
});


Trong đó: $view là view bạn muốn tác động. Nếu bạn muốn tác động đến nhiều view bạn có thể truyền vào một mảng và nếu bạn muốn tác động hết thì chỉ cần khai báo $view = '*'.

VD: Mình sẽ thêm $title vào trong view home. Sử dụng view composer.

Ví dụ

View::composer('home', function ($view) {
    $view->with('title', 'VZN.vn');
});


Đối với view composer class, các bạn sử dụng cú pháp sau:

View::composer($views, $className);


Trong đó:
- $view thì tương tự như đối với view composer closure.
- $className là tên của class chưa logic composer. Class composer này bắt buộc phải có method compose có visibility là public và nhận tham số truyền vào là một View object.

VD: Cũng giống như ví dụ trên nhưng sử dụng view composer class.

- file app/Http/View/Composers/SiteNameComposer.php.

Ví dụ

<?php

namespace App\Http\View\Composers;

use App\Repositories\UserRepository;
use Illuminate\View\View;

class SiteNameComposer
{
    /**
     * The user repository implementation.
     *
     * @var \App\Repositories\UserRepository
     */
    protected $users;

    /**
     * Create a new profile composer.
     *
     * @param  \App\Repositories\UserRepository  $users
     * @return void
     */
    public function __construct(UserRepository $users)
    {
        // Dependencies automatically resolved by service container...
        $this->users = $users;
    }

    /**
     * Bind data to the view.
     *
     * @param  \Illuminate\View\View  $view
     * @return void
     */
    public function compose(View $view)
    {
        $view->with('title', 'VZN.vn');
    }
}

- Khai báo trong provider.

Ví dụ

use App\Http\View\Composers\SiteNameComposer;

View::composer('home', SiteNameComposer::class);

Bài viết này đã giúp ích cho bạn?

Advertisements