Laravel Livewire 在慢速上传之前刷新视图答案

【问题标题】：Laravel Livewire refresh view before slow uploadLaravel Livewire 在慢速上传之前刷新视图
【发布时间】：2026-02-01 10:20:02
【问题描述】：

我有一个 livewire 组件，它实现了 Spatie Media Library Pro 组件：

// file-upload.blade.php
<form method="POST" wire:submit.prevent="submit">
  @csrf
  <div class="mb-3">
    <x-media-library-attachment name="media" :rules="$mimeTypes" key="mediaLibrary"/>
  </div>
  @if($uploading)
    <h2>Please wait...</h2>
  @endif
  <input type="submit" class="btn btn-primary btn-bg" />
</form>

我想显示一条上传消息，因为请求很慢（上面的@if($uploading)）。

问题是，如果我这样做：

public function submit(){
  $this->validate([
    'media' => 'required|min:1',
  ]);
  
  $this->uploading = true;

  \Auth::user()->currentTeam
    ->addFromMediaLibraryRequest($this->media)
    ->toMediaCollection($this->collection);

  $this->clearMedia();

  return redirect()->route('media.index', ['collection' => $this->collection]);
}

$this->uploading = true; 行仅在整个函数完成后刷新我的页面，即上传完成后。

有没有办法可以显示这个，然后上传文件？我走的大多数其他路线要么破坏了验证，我尝试使用@entangle并从前端切换$uploading，但似乎没有什么对我有用。

我想我已经决定要保留现有的内容，但要么异步开始上传，要么更快地刷新视图。

【问题讨论】：

标签： laravel laravel-livewire

【解决方案1】：

您可以使用 Livewire 加载状态 (https://www.laravel-livewire.com/docs/2.x/loading-states)

<form method="POST" wire:submit.prevent="submit">
  @csrf
  <div class="mb-3">
    <x-media-library-attachment name="media" :rules="$mimeTypes" key="mediaLibrary"/>
  </div>
  <input type="submit" class="btn btn-primary btn-bg" />
</form>
<div wire:loading wire:target="submit">
   Loading...
</div>

PD：我之前没有在表单中测试过

【讨论】：