Laravel Livewire组件刷新后不会自动刷新/重新加载 [英] Laravel Livewire component not refreshing/reloading automatically after refreshing it

问题描述

因此，我目前在我的一个项目中使用 Laravel Livewire .但是，当我尝试通过魔术Mathod $refresh从一个组件向另一个组件发出事件时，它刷新了整个组件(在xhr request中获得了dom)，但是前端没有实时更新.

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 组件

  public function save()
    {
        //some functionalities .... 


        $this->emit('reviewSectionRefresh');


    }

ProductReviewSection.php 组件

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

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

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

因此，我想发出每当我从First组件调用save()函数时都要发出的reviewSectionRefresh事件，这应该由其他组件的$listeners侦听.一切正常.同样在xhr中，我正在获取刷新的dom，但是前端中的组件未更新.希望与Livewire合作的任何人都可以帮助您.

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.

推荐答案

所以看来我用错误的方式编写了组件刀片视图.

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

刷新后的组件上的所有内容都应包装在一个div元素中，如下所示:

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>

但是应该是这样.

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

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

所以无论您写什么内容，都应该放在一个父级划分元素中

这篇关于Laravel Livewire组件刷新后不会自动刷新/重新加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！