Laravel Livewire (2)

정종일·2023년 9월 22일
0

Laravel

목록 보기
2/9

Lifecycle Hooks

mount

  • 컴포넌트가 만들어질 때 최초 한 번만 호출
  • Livewire 컴포넌트는 생성자를 사용하지 않음
use Illuminate\Support\Facades\Auth;
use Livewire\Component;
 
class UpdateProfile extends Component
{
    public $name;
 
    public $email;
 
    public function mount()
    {
        $this->name = Auth::user()->name;
 
        $this->email = Auth::user()->email;
    }
 
    // ...
}

boot

  • 모든 요청 시 호출
use Livewire\Attributes\Locked;
use Livewire\Component;
use App\Models\Post;
 
class ShowPost extends Component
{
    #[Locked]
    public $postId = 1;
 
    protected Post $post;
 
    public function boot() 
    {
        $this->post = Post::find($this->postId);
    }
}

// #[Locked] 속성은 민감한 프로퍼티의 경우 값이 변경되지 않게 하기 위한 옵션이다. (final)

updating

  • 컴포넌트의 프로퍼티가 업데이트 될 때 호출
  • 클라이언트는 여러 방식으로 프로퍼티를 변경할 수 있지만 대부분 wire:model 을 통해 변경한다
use Exception;
use Livewire\Component;
 
class ShowPost extends Component
{
    public $postId = 1;
 
    public function updating($property, $value)
    {
        // $property: The name of the current property being updated
        // $value: The value about to be set to the property
 
        if ($property === 'postId') {
            throw new Exception;
        }
    }
 
    // ...
}

// $value는 무엇..?

updated

  • 컴포넌트의 프로퍼티가 업데이트 된 후 호출
use Livewire\Component;
 
class CreateUser extends Component
{
    public $username = '';
 
    public $email = '';
 
    public function updated($property)
    {
        // $property: The name of the current property that was updated
 
        if ($property === 'username') {
            $this->username = strtolower($this->username);
        }
    }
 
    // ...
}

rendering & rendered

  • render() 메서드 호출 전에 실행 & render() 메서드 호출 후에 실행
use Livewire\Component;
use App\Models\Post;
 
class ShowPosts extends Component
{
    public function render()
    {
        return view('livewire.show-posts', [
            'post' => Post::all(),
        ])
    }
 
    public function rendering($view, $data)
    {
        // Runs BEFORE the provided view is rendered...
        //
        // $view: The view about to be rendered
        // $data: The data provided to the view
    }
 
    public function rendered($view, $html)
    {
        // Runs AFTER the provided view is rendered...
        //
        // $view: The rendered view
        // $html: The final, rendered HTML
    }
 
    // ...
}

hydrate & dehydrate

  • 최초 렌더 요청 이후 들어오는 후속요청 때마다 호출 & 모든 요청이 종료될 때 호출
use Livewire\Component;
 
class ShowPost extends Component
{
    public $post;
 
    public function mount($title, $content)
    {
        // Runs at the beginning of the first initial request...
 
        $this->post = new PostDto([
            'title' => $title,
            'content' => $content,
        ]);
    }
 
    public function hydrate()
    {
        // Runs at the beginning of every "subsequent" request...
        // This doesn't run on the initial request ("mount" does)...
 
        $this->post = new PostDto($this->post);
    }
 
    public function dehydrate()
    {
        // Runs at the end of every single request...
 
        $this->post = $this->post->toArray();
    }
 
    // ...
}
profile
제어할 수 없는 것에 의지하지 말자

0개의 댓글