Neeraj1005's avatar

Livewire\Exceptions\PropertyNotFoundException Property [$searchItem] not found on component: [landing-page.right-sidebar]

In my project my trying to make a search box. But I have two livewire component one in list-post part and another is right-side-bar.

Imgur

This is my list-posts.blade

<div>
    <div class="row featured-post-heading">
        <div class="col-md-12 mt-5 mb-3">
        </div>
     </div>
     <div class="row">
        <div class="col-md-9 pl-0 pr-5">
            @forelse($list_of_posts as $post)
            <div class="col-md-12 border-bottom pb-3 mb-3">
                <div class="media">
                    <img src="{{ optional($post->featured_image)->getFullUrl() ?? $post->default_image }}" width="175" class="mr-3 img-fluid rounded" alt="{{ $post->slug }}">
                    <div class="media-body">
                        <h5 class="mt-0"><a href="{{ route('post.viewitem', $post->slug) }}">{{ $post->title }}</a></h5>
                        <div class="blog-info mb-3"><span>{{ $post->created_at->toFormattedDateString() }}</span> <span>{{ $post->category->name }}</span></div>
                            <p>{!! $post->summary_of_body !!}</p>
                        </div>
                </div>
            </div>

            @empty
             <h3>No Posts Available</h3>
            @endforelse
            {{ $list_of_posts->links() }}
        </div>

	{{-- This is right-sidebar-component --}}
        <livewire:landing-page.right-sidebar :searchItem="$searchItem"/>

     </div>
</div>

And this is my Right-sidebar.blade

<div>
        <div class="mb-4">
            <h6 class="mb-4">Search</h6>
            <div class="input-group">
                <input wire:model.debounce.300ms="searchItem" type="text" class="form-control" placeholder="Search for...">
            </div>
        </div>

        <div class="mb-4">
            <h6 class="mb-4"><a href="{{ route('lists_of_category') }}">Categories</a></h6>
            @forelse ($blog_categories as $cat)
            <p class="border-bottom pb-2 mb-2"><a href="{{ route('latest.latestpost',['category' => $cat->name]) }}">
                <i class="fas fa-chevron-right"></i> {{ $cat->name }} [{{ $cat->category_has_total_posts() }}]</a></p>
            @empty
            <p><a href="#">{{ __('No Categories Available') }}</a></p>
            @endforelse
        </div>
</div>

And this is main ListPostComponent

<?php

namespace App\Http\Livewire\LandingPage;

use App\Post;
use Livewire\Component;
use Livewire\WithPagination;

class ListPosts extends Component
{
    use WithPagination;

    public $searchItem = '';

    protected $paginationTheme = 'bootstrap';

    public function render()
    {
        $lists_of_posts = Post::categoryFilter(request('category'))
                                ->tagFilter(request('tags'))
                                ->popularFilter(request('blogs'))
                                ->featuredFilter(request('blogs'))
                                ->search($this->searchItem)
                                ->orderBy('id', 'desc')->paginate(10);
        return view('livewire.landing-page.list-posts', [
            'list_of_posts' => $lists_of_posts,
        ]);
    }
}

0 likes
1 reply
vincent15000's avatar

You have to declare your $searchItem in your right-sidebar component too.

Please or to participate in this conversation.