15

So, I'm currently using Laravel Livewire in one of my projects. But when I try emit an event from one component to another component by magic mathod $refresh , its refreshing (got the dom in xhr request ) the total component but the Front end is not updating realtime.

ProductReviewForm.php Component:

public function save()
{
    //some functionalities .... 
    $this->emit('reviewSectionRefresh');
}

ProductReviewSection.php Component:

protected $listeners = [
    'reviewSectionRefresh' => '$refresh',
];

public function render()
{
    $this->review_lists = ProductReview::orderBy('id', 'DESC')->get();

    return view('livewire.desktop.product-review-section');
}

So I want to emit the reviewSectionRefresh event to be emitted whenever I call save() function from First component, That should be listened by $listeners from other component. This is working fine. also in xhr I'm getting the refreshed dom but the component in frontend is not updating. Hoping anyone working with Livewire may help with that.

Vinícius Fagundes
  • 1,983
  • 14
  • 24
fahim152
  • 2,531
  • 1
  • 10
  • 29
  • I am not sure, but can you try `'$refresh'` without quotes. – KPK Feb 25 '20 at 13:34
  • Have you tried to pass the objects to the `view()` as the second param? `return view('template-name', ['review_lists' => $review_lists]); – Chemaclass Feb 25 '20 at 13:38
  • @KPK , no that would give error, undefined $refresh , because that will expect $refresh variable. you can see https://calebporzio.com/video-realtime-livewire-w-laravel-echo-pusher this. ( Second video at 2.54 min ) Livewire is completely a new thing coming out some while ago, thats why I couldn't find any help so far. – fahim152 Feb 25 '20 at 13:53
  • Do you have trigger action in view? Something like ` – Wahyu Kristianto Feb 25 '20 at 13:54
  • @Chemaclass it doesn't work like that way bro :( see about **Livewire** here: https://youtu.be/fX1aOWWt2nQ – fahim152 Feb 25 '20 at 13:55
  • @WahyuKristianto yes brother, here it is on my component – fahim152 Feb 25 '20 at 13:56
  • @WahyuKristianto even I tried to define a function to call for that listener and tried dd() there. it works when I click submit. but '$refresh' is not working for some reason. my component is not refreshing. – fahim152 Feb 25 '20 at 13:58
  • @fahim152 This should not be a problem. I tried it locally and it worked. I give `Current time: {{now ()}}` to check the listener works. – Wahyu Kristianto Feb 25 '20 at 14:00
  • My listener is working brother but I want my component to be refreshed everytime that event emits. Caleb Porzio showed that thing one of his tutorial. here : https://calebporzio.com/video-realtime-livewire-w-laravel-echo-pusher – fahim152 Feb 25 '20 at 14:12

1 Answers1

51

So it seems I've write my component blade view in wrong way.

all things on refreshed component should be wrapped in one div element like this: 

<div> 
{{-- Anything you want to do --}}

</div>

previously my blade file was like. Which is Wrong

<div class=""> 
 {{ -- some dom elements -- }}
</div>

<div class=""> 
{{ -- some other dom elements -- }}
</div>

but that should be like. 

<div>
    <div class=""> 
       {{ -- some dom elements -- }}
    </div>

    <div class=""> 
    {{ -- some other dom elements -- }}
    </div>
</div>

So Whatever you write, that should be inside ONE PARENT DIV ELEMENT

fahim152
  • 2,531
  • 1
  • 10
  • 29
  • 3
    yes Livewire components MUST have a single root element – Wahyu Kristianto Feb 27 '20 at 07:55
  • 4
    Oh Man. I forget to check that my component was not wrapped in same element. I was scratching my head for two hours – James Sep 12 '20 at 14:06
  • hope it helps you out bro. It also took my hours when I was learning livewire for the very first time. :D – fahim152 Sep 13 '20 at 07:09
  • Hi Guys, I am also new to laravel livewire. I am having issues with wire:model and wire:click. The model value is not initialised event though I set the value in the mount method. Both the click and the model elements are inside a parent div element and it still does not work. Can any of you experienced livewire users please suggest some pointers? – Sanjeet Chand Oct 08 '20 at 22:40
  • @SanjeetChand if you couldn't find proper answer of your issue please post a question in SO with details. It would be much better to understand your query then – fahim152 Oct 09 '20 at 14:07