livewire 搜索结果得到所有产品，但我不想要答案

【问题标题】：livewire search results get allmyproducts but idont wantlivewire 搜索结果得到所有产品，但我不想要
【发布时间】：2021-08-06 01:31:12
【问题描述】：

我在我网站的标题部分我搜索了我的产品

我在输入下方放了一个框来显示在那个框中搜索的产品，但是在搜索之前，我所有的产品都显示在那个框中...

我不想要这个。

这是我的搜索组件

public $search;
public $item;
public function mount(Product $item){
    $this->item = $item;
}

protected $queryString = ['search'];
public function render()
{
    
    $allPro = Product::where('title', 'LIKE', "%{$this->search}%")->latest()->paginate(1);
    return view('livewire.site.layout.header.search',compact('allPro'));
}

刀片

    <div class="header-center">
    <div class="header-search header-search-extended header-search-visible d-none d-lg-block">
        <a href="#" class="search-toggle" role="button"><i class="icon-search"></i></a>
        <form action="" method="get" class="compare-dropdown">
            @csrf
            <div class="header-search-wrapper search-wrapper-wide dropdown-toggle" role="button"
                data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-display="static"
                title="جستجوی محصولات" aria-label="Compare Products">

                <label for="q" class="sr-only">جستجو</label>
                <button class="btn btn-primary" type="submit"><i class="icon-search"></i></button>
                
                <input wire:model.debounce.1000="search" type="search" class="form-control" name="q" id="q"
                    placeholder="جستجوی محصولات ..." autocomplete="off" value="" required>
                    <div style="display: none;margin:8px" wire:target="search" wire:loading class="spinner-border" role="status">
                        <span class="sr-only">Loading...</span>
                    </div>
            </div>
           


            <div class="dropdown-menu dropdown-menu-right" id="d">
                <div class="dropdown-cart-products">

                    @if ($allPro->count() > 0)
                        @foreach ($allPro as $item)
                            <div class="product">
                                <div class="product-cart-details">
                                    <h6 class="product-title" style="font-size: 15px">
                                        <a
                                            href="{{ route('site.product.index', $item->id) }}">{{ $item->title }}</a>
                                    </h6>
                                </div>
                                <!-- End .product-cart-details -->

                                <figure class="product-image-container">
                                    <a href="{{ route('site.product.index', $item->id) }}" class="product-image">
                                        <img src="{{ url('') }}{{ $item->image }}"
                                            alt="{{ $item->title }}" width="100" height="100">
                                    </a>
                                </figure>
                            </div>
                            <!-- End .product -->
                            {!! $allPro->links() !!}
                        @endforeach
                    @else
                        <p>ببخشید ولی نتونستیم چیزی مرتبط با جستجو شما پیدا کنیم</p>
                    @endif

                </div>
            </div>
            <!-- End .header-search-wrapper -->
        </form>
    </div>
    <!-- End .header-search -->
</div>

照片 photo

【问题讨论】：

标签： laravel laravel-7 laravel-livewire

【解决方案1】：

这是因为渲染迫在眉睫。将查询移动到一个函数中并使用Livewires Updated Hook 来启动它

试试这样的：

控制器：

    public $search;
    public $allPro; // <- declear $allPro as public property
    protected $queryString = ['search'];

    public function updatedSearch()
    {
        $this->run();
    }

    public function run()
    {
        $this->allPro = Product::where('title', 'LIKE', "%{$this->search}%")->latest()->paginate(1);
    }

    public function render()
    {
        return view('livewire.site.layout.header.search');
    }

【讨论】：