Laravel Livewire：如何强制刷新计算的属性（和 DOM）？

Question

我有一个“最喜欢的”组件。该组件绘制了一颗星星，根据状态获得三个 classes。为了 select 将哪个 class 应用到组件，我使用计算属性，定义为：

  public function getEsFavoritaProperty() {
    return $this->idea->users()->where('user_id', Auth::user()->id)->count() > 0;
  }

  public function getFavoritaProperty() {

    if (Auth::guest()) return 'voto-idea-inactivo';

    if ($this->EsFavorita) {
      return 'voto-idea-seleccionado';
    } else {
      return 'voto-idea-activo';
    }
  }

这是西班牙语，但我认为逻辑很清楚：如果没有登录用户（来宾），那么函数将 return voto-idea-inactivo class，如果用户已登录，它将 return 一个或另一个基于询问当前项目是否被当前用户收藏的函数。

这两个功能按预期工作。如果我直接在数据库中更改枢轴 table 中的数据，则星号会正确显示状态。

现在我有这个主播<a>在星...

<a wire:click.prevent="toggleFavorita">
    <i class="fas fa-star fa-2x {{ $this->favorita }}"></i>
</a>

所以它切换（attach/detach）关系，功能是：

  public function toggleFavorita() {
    if ($this->EsFavorita) {
      $this->idea->users()->detach(Auth::user()->id);
    } else {
      $this->idea->users()->attach(Auth::user()->id);
    }
  }

这个功能也很完美，如果用户点击星标，该功能会在数据库中创建或删除关系。问题是星星没有重新绘制，并保持以前的状态。如果我重新加载页面，就会出现更改。

那么我该如何强制这颗星使用新的计算值进行刷新呢？

Answer 1

我解决了问题...与刷新组件无关‍♂️

事情是...在 toggleFavorita 计算的属性中，我试图访问另一个属性，在本例中 EsFavorita 由 [=13= 定义]

我所做的是将该函数从计算属性更改为普通函数，然后调用该函数......所以修改后的编码现在看起来像：

public function EsFavorita() {
    return $this->idea->users()->where('user_id', Auth::user()->id)->count() > 0;
}

public function toggleFavorita() {
    if ($this->EsFavorita()) {
        $this->idea->users()->detach(Auth::user()->id);
    } else {
        $this->idea->users()->attach(Auth::user()->id);
    }
}

我不知道，看起来像一个生命周期，计算的属性在其他一切之后刷新。我花了很多时间和很多 Log::info() 来弄清楚

Laravel Livewire：如何强制刷新计算的属性（和 DOM）？

Laravel Livewire: how to force refresh of a computed property (and the DOM)?

php

laravel