Livewire validateOnly 与同一组件中的验证

Question

我在使用 livewire ( laravel ) 进行数据验证时遇到了一点问题。

我注意到当我设置实时验证时（validateOnly()），表单中输入的信息是实时验证的。在这个级别一切都很好。

但是当我点击按钮提交表单时（即使表单包含错误），表单很不幸地被发送到我在 wire:submit[=33= 中定义的函数].

所以我的问题是：是否可以在提交表单后接收数据的 wire:submit 方法中重新验证信息？如果可以，我该怎么做？

PS：我试图在我的 wire:submit 函数中设置验证方法，但没有任何反应。它会阻止提交表单，但不会给我错误。

我的源代码：

<?php class UserProfile extends Component { use WithFileUploads; public $countries = []; public $profile = []; protected function rules() { if ( !LivewireUpdateProfileRequest::authorize() ) { return abort(403, "Your are not authorized to make this request !"); } $rules = LivewireUpdateProfileRequest::rules(); if ( !empty($this->profile['phone']) ) { $rules['profile.phone'] = [ 'required', 'phone_number:' . $this->profile['phone'] ]; } return $rules; } public function mount() { $this->countries = Countries::all(); $this->profile = Auth::user()->toArray(); } public function updateUserProfile() { $validatedData = $this->validate(); dd( $validatedData ); } public function updated($key, $value) { $this->validateOnly($key); } public function render() { return view('livewire.user-profile'); } }

Html 来源：

<form action="" method="POST" wire:submit.prevent="updateUserProfile"> <input name="profile.email" type="email" wire:model="profile.email" /> @error('profile.email') {{ $message }} @enderror <input name="profile.phone" type="tel" wire:model="profile.phone" /> @error('profile.phone') {{ $message }} @enderror </form>

这里是 LivewireUpdateProfileRequest 内容：

<?php namespace App\Http\Requests\Web; use Illuminate\Foundation\Http\FormRequest; class LivewireUpdateProfileRequest extends FormRequest { /** * Determine if the user is authorized to make this request. * * @return bool */ public static function authorize() { return true; } /** * Get the validation rules that apply to the request. * * @return array */ public static function rules() { return [ 'profile' => ['required', 'array', 'size:10'], 'profile.firstname' => ['required', 'string'], 'profile.lastname' => ['required', 'string'], 'profile.email' => ['required', 'email'], 'profile.phone' => ['required', 'phone_number:33'], 'profile.gender' => ['required', 'gender'], 'profile.image' => ['sometimes', 'image', 'mimes:png,jpg,jpeg'], 'profile.address' => ['required', 'string'], 'profile.city' => ['required', 'string'], 'profile.country_id' => ['required', 'exists:countries,id'], 'profile.birth_at' => ['required', 'date', 'min_age:18'], ]; } }

Answer 1

通常在您的保存方法中，您会对所有字段再次运行验证。 livewire 文档分享了这个例子：

Livewire 组件：

class ContactForm extends Component
{
    public $name;
    public $email;

    protected $rules = [
        'name' => 'required|min:6',
        'email' => 'required|email',
    ];

    public function updated($propertyName)
    {
        $this->validateOnly($propertyName);
    }

    public function saveContact()
    {
        $validatedData = $this->validate();

        Contact::create($validatedData);
    }
}

有了这个HTML:

<form wire:submit.prevent="saveContact">
    <input type="text" wire:model="name">
    @error('name') <span class="error">{{ $message }}</span> @enderror

    <input type="text" wire:model="email">
    @error('email') <span class="error">{{ $message }}</span> @enderror

    <button type="submit">Save Contact</button>
</form>

这应该使用 updated 方法近乎实时地验证输入，并使用 saveContact 方法提交。

如果您可以分享您的代码，我们可以更轻松地进行调试。

来源：https://laravel-livewire.com/docs/2.x/input-validation#real-time-validation

Livewire validateOnly 与同一组件中的验证

Livewire validateOnly with validate in the same component

laravel

laravel-livewire