The lazy
directive modifier on your input
prevents a request being sent to the server when the field is updating (150ms default debounce). If you want to provide feedback as they type, remove the lazy
modifier.
In order to determine if the username/email
is in use, you'll want to hook into the lifecycle of your username
property. By this I mean the updatedUsername
function which will fire when the value of your username
property updates in the Livewire component.
You could do something like the following (works with or without the lazy
modifier on the input field):
Livewire view
<div>
<label for="username">Username</label>
<input id="username" name="username" type="text" value="{{ old('username') }}"
wire:model="username">
<p>{{ $availability }}</p>
</div>
Livewire component
namespace AppHttpLivewire;
use AppModelsUser;
use LivewireComponent;
class RegisterForm extends Component
{
public $username;
public $availability;
public function render()
{
return view('livewire.register-form');
}
public function updatedUsername()
{
if (User::where('email', $this->username)->first()) {
$this->availability = 'That username is already taken';
return;
}
$this->availability = '';
}
}
Hopefully the above is self explanitory.
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…