Livewire动作的顺风流咬模态问题

Question

我有一个真正的困难的时间使用Flowbite的模态与Livewire。我有一个刀片视图restaurants.index渲染x-layout刀片组件，调用<livewire:restaurants/>组件，以及用于创建新资源的模式。(restaunts。索引视图代码)

livewire:restaurants/view组件的代码如下，而Restaurants类组件的代码如下:

class Restaurants extends Component
{
use WithPagination;
public $categories;
protected $restaurants;
public function delete($id)
{
Restaurant::find($id)->delete();
}
public function render()
{
$this->categories = Category::where('type', 'Restaurant')->get();
$this->db_restaurants = Restaurant::all();
$google_places_api = new PlacesApi(env('GOOGLE_MAPS_API_KEY'));
$restaurantsGooglePlacesResponse = array();
foreach ($this->db_restaurants as $restaurant) {
$response = $google_places_api->placeDetails($restaurant->google_place_id);
$details = $response['result'];
$photo_reference = array_shift($details['photos'])['photo_reference'];
$photo_url = $google_places_api->photo($photo_reference, $params = ['maxheight' => 400, 'maxwidth' => 400]);
$details['photo_url'] = $photo_url;
$details['internal_restaurant_id'] = $restaurant->id;
$details['internal_created_at'] = $restaurant->created_at;
array_push($restaurantsGooglePlacesResponse, $details);
}
$this->restaurants = collect($restaurantsGooglePlacesResponse)->paginate(8);
return view('livewire.restaurants', ['restaurants' => $this->restaurants]);
}
}

我面临的问题是，在第一页加载时，三种模态中的每一种都显示并正确工作。尽管如此，当我执行Livewire操作(例如，通过delete()方法删除一条记录)时，情态或者完全停止工作，或者即使它们工作，也没有适当地呈现(例如，在页面的左上角生成)。

这似乎是由Livewire引起的特殊行为。你知道导致这个问题的原因和解决方法吗?

Answer 1

你能做的是处理这个问题是放一个按钮，将发出一个事件，然后在该事件，你可以使用JS点击切换模式按钮，然后调用一个方法，将做你想做的工作。