Làm cách nào để hiển thị dữ liệu ở chế độ xem phiến trong Laravel Livewire?

Mô hình chế độ xem biểu thị dữ liệu cho một chế độ xem hoặc trang cụ thể. Ở dạng đơn giản nhất, một mô hình khung nhìn là một đối tượng PHP đơn giản với một loạt các thuộc tính [đã nhập]

class ProfileViewModel
{
    public function __construct[
        public User $user,
        public array $companies,
        public string $action,
    ] {}
}

Các mô hình xem làm cho các phụ thuộc của một chế độ xem trở nên rõ ràng. Với mô hình chế độ xem, bạn không cần phải đào sâu vào đánh dấu của chế độ xem để tìm ra dữ liệu nào nó yêu cầu

Để sử dụng một mô hình dạng xem, hãy khởi tạo nó trong hành động của bộ điều khiển của bạn và chuyển nó tới dạng xem. Tôi đã xây dựng thói quen chuyển các mô hình xem dưới dạng biến

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

2 để giữ cho chúng nhất quán trên tất cả các mẫu

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

    
    
        @foreach[$view->companies as $company]
            …
        @endforeach
    

siêu năng lực IDE

Và bây giờ là phần thú vị. nhập gợi ý biến trong khối

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

3 ở đầu chế độ xem Blade của bạn và bắt đầu viết HTML

@php
    /** @var $view App\Http\ViewModels\ProfileViewModel */
@endphp
 
    
    
        @foreach[$view->companies as $company]
            …

  

        @endforeach
    

Đây là nơi các mô hình xem tỏa sáng. Một IDE sẽ nhận ra khai báo

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

4 và cung cấp tính năng tự động hoàn thành cho dữ liệu dạng xem. Ngoài ra, nếu bạn đổi tên một trong các thuộc tính của chế độ xem bằng khả năng tái cấu trúc của IDE, thì nó cũng sẽ đổi tên các tập quán trong chế độ xem

Refactor đổi tên

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

5 trong PhpStorm

________số 8

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

6 và

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

7 sẽ được cập nhật tự động

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 

  

        return view['profile.edit', ['view' => $viewModel]];
    }
}

1

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

2

Dữ liệu được tính toán

Các mô hình xem cũng là một nơi tuyệt vời để tính toán dữ liệu trước khi gửi nó đến một chế độ xem. Điều này giữ các câu lệnh phức tạp bên ngoài bộ điều khiển và chế độ xem

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

3

Bạn có thể triển khai điều này dưới dạng

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

8, nhưng tôi thích xem các mô hình cho những thứ chỉ dùng một lần

công thái học

Bạn có thể chuẩn hóa biến

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

2 bằng cách tạo một lớp cơ sở

    
    
        @foreach[$view->companies as $company]
            …
        @endforeach
    

0 thực hiện

    
    

  

        @foreach[$view->companies as $company]
            …
        @endforeach
    

1

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

8

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

9

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

0

độ chi tiết

Ngoài ra, bạn có thể chi tiết hơn và chỉ định dữ liệu chính xác mà bạn muốn hiển thị thay vì chuyển các mô hình

Cách tiếp cận này đòi hỏi nhiều bản mẫu hơn. Tuy nhiên, nó làm cho các phụ thuộc của chế độ xem rõ ràng hơn và có thể tái sử dụng. Ví dụ,

class ProfileController
{
    public function edit[]
    {
        $viewModel = new ProfileViewModel[
            user: Auth::user[],
            companies: Companies::all[],
            action: action[[ProfileController::class, 'update']],
        ];
 
        return view['profile.edit', ['view' => $viewModel]];
    }
}

5 này có thể được sử dụng lại cho các mô hình khác ngoài

    
    
        @foreach[$view->companies as $company]
            …
        @endforeach
    

3

Làm cách nào để hiển thị dữ liệu trong Laravel blade?

Làm cách nào để truyền dữ liệu cho tất cả các chế độ xem trong Laravel?

Làm cách nào để cập nhật dữ liệu trong Laravel Livewire?

{{ }} trong Laravel là gì?