محمود الحبشمتاح لمشاريع جديدة
  • أعماليأعمالي
  • الخدماتالخدمات
  • المختبرالمختبر
  • المقالاتالمقالات
  • تواصلتواصل
عمّان--:--EN
المقالات/لارافيل

البحث التلقائي في Livewire

أنشئ مكون بحث بإكمال تلقائي مع Livewire.

16 يناير 2026دقيقة قراءةلارافيلRead in English

في هذه الصفحة

  1. المكون
  2. العرض

البحث بإكمال تلقائي:

المكون

php
public string $search = '';
public ?User $selected = null;

#[Computed]
public function results()
{
    if (strlen($this->search) < 2) return [];
    return User::where('name', 'like', "%{$this->search}%")
        ->limit(5)->get();
}

public function select(User $user)
{
    $this->selected = $user;
    $this->search = $user->name;
}

العرض

blade
<div x-data="{ open: false }">
    <input wire:model.live.debounce.300ms="search" @focus="open = true">
    
    <ul x-show="open && $wire.results.length">
        @foreach($this->results as $user)
            <li wire:click="select({{ $user->id }})" @click="open = false">
                {{ $user->name }}
            </li>
        @endforeach
    </ul>
</div>
كل المقالات

تابع القراءة

  • نمط فئات الإجراءات في Laravel16 يناير 2026دقيقة قراءة
  • فئات الإجراءات في Laravel: مسؤولية واحدة16 يناير 2026دقيقة قراءة
  • تحديد معدل API في Laravel16 يناير 2026دقيقة قراءة