Level 6
Sounds like a dom diffing issue, but without the whole component, we can only make assumptions. Is this a nested component? Do you have wire:keys ? Have you included your @if inside a DIV element ?
Aug 30, 2024
7
Level 2
caught Snapshot missing on Livewire component with id:
When i click those buttons
{{-- Filter by Gender --}} @if (!$hideGenderFilter) š Filter by Gender
<button wire:click="setGender('female')"
class="flex-1 px-4 py-2 rounded-lg text-sm hover:bg-secondary hover:text-foreground focus:outline-none @if ($gender == 'female') bg-pink-500 text-white @else text-foreground @endif">š© Women</button>
<button wire:click="setGender('male')"
class="flex-1 px-4 py-2 rounded-lg text-sm hover:bg-secondary hover:text-foreground focus:outline-none @if ($gender == 'male') bg-blue-500 text-white @else text-foreground @endif">šØ Men</button>
</div>
</div>
@endif
i get this error "caught Snapshot missing on Livewire component with id:" and after that "Uncaught Component not found"
Level 2
I am including my component here
and the component content is wrapped arount a div
And yeah i have a wire keys. But on the buttons i don't have wire keys but every foreach have them.
Level 6
@Yordan1948 Are you able to provide the code of the component?
Instead of doing @ifs try entangling your boolean to an alpine property, and then do x-show. Does the problem still persist?
1 like
Level 6
@Yordan1948 I didnt say your component inside DIVs. I said your @ifs inside a div. your @if is adding DOM content that Livewire wouldn't otherwise expect to append to that point. Enclosing your @if statements with div, makes it easier for livewire to append the DOM content you want without everything going "f**k all"
Level 2
@Chingy I tried but it doesnt work this is my code
Level 6
@Yordan1948 https://wirebox.app/ can you set up a wire playground here ?
Level 2
@Chingy fixed. Thanks for the support
Please or to participate in this conversation.