2 years ago

Let's create a confirmation dialog using Livewire. The confirm dialog will display and do what ever it needs after the user click on confirm button. 'display', ]; public $state = [ 'title' => '', 'message' => '', 'return' => [ 'component' => '', 'args' => [], ], ]; public function display($title, $message, $component,...$args) { $this->state['title'] = $title; $this->state['message'] = $message; $this->state['return'] = [ 'component' => $component, 'args' => $args, ]; $this->displayingModal = true; } public function confirm() { $this->emitTo( $this->state['return']['component'], ...$this->state['return']['args']); $this->displayingModal = false; } public function cancel() { $this->state = [ 'title' => '', 'message' => '', 'return' => [ 'component' => '', 'args' => [], ], ]; $this->displayingModal = false; } public function render() { return view('livewire.confirm'); }}

And the usage will be like: $this->emitTo('confirm', 'displayConfirmation', 'Delete Record', 'Are you sure?', 'livewire-component-name', 'destroyRecord', '11234'); The emitTo basically trigger to given Livewire component's name, call the method, and pass whatever arguments required for the method.

destroyRecord is a method to be call i livewire-component-name, and '1234' argument expected to received in destroyRecord in livewire-component-name.