I am trying to fetch all subcategories related to a single category with Livewire but am getting an error.
Undefined variable $categorie_id.
The thing is, I’m trying to fetch and render the souscategories
for a given category
.
Category
public function souscategories()
{
return $this->hasMany(Sous_categorie::class, 'categorie_id', 'id');
}
Sous_categorie
public function categories()
{
return $this->belongsTo(Categorie::class,'categorie_id','id');
}
As you can see, there’s a relationship between the Category
and Sous_categorye
models.
My Component
code where I fetch all Categories
:
class DropMenu extends Component
{
public $categories;
public $sous_categories;
public function mount($categorie_id)
{
$this->categories = Categorie::findOrFail($categorie_id);
}
public function render()
{
return view('livewire.drop-menu');
}
}
And this is my blade view:
<div>
<ul>
@foreach ($categories->souscategories as $subcategory)
<li>{{ $subcategory->nom }}</li>
@endforeach
</ul>
</div>
And inside my Main Blade file:
<ul role="tree">
@foreach ($categories as $item)
<li class="haschildren" role="treeitem" aria-expanded="false">
<div>
<a href="#" class="link font-bold font-display text-base text-jacarta-700 dark:text-white hover:text-accent focus:text-accent dark:hover:text-accent dark:focus:text-accent">{{ $item->nom }}</a>
<a aria-label="Expand submenu" href="#" data-aria-label="Expand submenu" data-aria-label-active="Collapse submenu" class="expand flex font-bold text-jacarta-700 dark:text-white">2
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" class=" dark:fill-white">
<path fill="none" d="M0 0h24v24H0z"></path>
<path d="M12 13.172l4.95-4.95 1.414 1.414L12 16 5.636 9.636 7.05 8.222z"></path>
</svg>
</a>
</div>
@livewire('drop-menu', ['categorie_id' => $categorie_id])
</li>
@endforeach
</ul>
I am new to Livewire, so I haven’t tried anything yet. Please feel free to tell me what I did wrong and if there’s a better way to do it.
>Solution :
You’re encountering an error because the variable $categorie_id
is not defined in the context where you’re trying to use it. In your main Blade file, you’re trying to pass $categorie_id
to the drop-menu
Livewire component, but it seems like $categorie_id
is not defined anywhere in that file.
Instead, you should pass $item->id
as the categorie_id
, because $item
is the current category in your @foreach
loop.
Replace this line in your main Blade file:
@livewire('drop-menu', ['categorie_id' => $categorie_id])
With this:
@livewire('drop-menu', ['categorie_id' => $item->id])
This will pass the ID of the current category to your Livewire component, which should resolve the "Undefined variable" error.