View Trong Laravel 8

Sau khi đã giới thiệu xong về route trong laravel 8 rồi, bài này mình sẽ giới thiệu với mọi người về view trong laravel 8.

Như ở phần trước các bạn cũng đã thấy, chúng ta hoàn toàn có thể trả về mã HTML ở trong route, nhưng nếu như HTML mà dài thì code của bạn sẽ rất rối. Chính vì thế các bạn cần phải đưa nó vào view để cho dễ quản lí.

1. Tạo view trong Laravel 8

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:

<!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>Toidicode.com</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.

/* routes/web.php */

use Illuminate\Support\Facades\Route;

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

Kết quả:

View trong laravel 8

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

- file resources/views/home.php.

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

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

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

Và đây là kết quả dưới dạng viewsource cho mọi người dễ hình dung:

view trong laravel 8

Nếu trong trường hợp view của bạn nằm trong một thư mục con trong 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:

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

Route::get('/', function () {
    return view('home.index', ['title' => 'toidicode.com', '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.

VD:

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.

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.

<?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', 'Toidicode.com');
    }
}

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

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.

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

Đố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.

<?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', 'Toidicode.com');
    }
}

- Khai báo trong provider.

use App\Http\View\Composers\SiteNameComposer;

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

7. Lời kết.

Phần này mình mới chỉ nói đến các khái niệm, các cách binding data vào view trong Laravel thôi. Phần sau mình sẽ giới thiệu với mọi người về blade trong Laravel.