问题
Im getting this error when sending an event from child to parent container. I am using wire:key
as recommended but get the JS error Cannot read property 'fingerprint' of null
. Any ideas what I am doing wrong? Please see example below.
Container
class Container extends Component
{
public $listeners = [
'submit'
];
public function render()
{
return view('livewire.container');
}
public function submit()
{
//dd("The child says wow - it works!");
}
}
with view
<div>
<h1>Im the container</h1>
@foreach([1,2,3] as $nbr)
@livewire('child', compact('nbr'))
@endforeach
</div>
Child
class Child extends Component
{
public $nbr;
public function mount($nbr)
{
$this->nbr = $nbr;
}
public function render()
{
return view('livewire.child');
}
public function submit()
{
$this->emit('submit', 'wow!');
}
}
with view
<div wire:key="{{ $nbr }}">
Hey im a child
<button wire:click="submit">submit</button>
</div>
回答1:
When defining Livewire components in a loop, you need to give them a key, so Livewire can keep track of each individual component.
<div>
<h1>Im the container</h1>
@foreach([1,2,3] as $key=>$nbr)
@livewire('child', compact('nbr'), key($nbr))
@endforeach
</div>
This is done on the component, not on the root-element in the view, meaning that its incorrectly placed with wire:key="{{ $nbr }}"
being in your child-view.
来源:https://stackoverflow.com/questions/64766632/sending-laravel-livewire-event-from-child-to-parent-gives-fingerprint-error