I'm not a Livewire expert, but don't events suit your needs?
How to pass child component's data to parent component
I made two different components: a child and a parent.
The parent component has a button that shows the current time upon clicking. The child component has a foreach loop that loops through each record and displays a button that again shows the current date and time.
If I refresh the parent page, none of the child elements are affected. That being said, each child, upon clicking the Refresh Child button, shows the date and time for that specific record for that single row, AND NOT THE PARENT OR OTHER CHILDREN.
How can I have it so that upon clicking a child's refresh button, both the single selected child element AND parent element gets refreshed?
Here is my parent view:
<div>
@foreach ($contacts as $contact)
@include('livewire.say-hi',
['contact' => $contact],
key($contact->name))
@endforeach
<!-- Refreshes parent outside of @ foreach-->
<!-- Only refreshes parent component, NOT Children -->
<button wire:click="$refresh">Refresh Parent</button>
{{ now() }}
</div>
Here is the parent controller:
<?php
namespace App\Livewire;
use Livewire\Component;
class HelloWorld extends Component
{
public $contacts;
public function mount()
{
$this->contacts = Contact::all();
}
public function render()
{
return view('livewire.hello-world');
}
}
Here is my child view:
<div>
<input type="text" wire:model="name">
{{ $contact->name }}: Refresh time: {{ now() }}
<!-- On click refreshes page and shows time of change -->
<!-- Only refreshes single line -->
<button wire:click="$refresh">Refresh Child</button>
<!-- How to refresh SINGLE child component, AND Parent??? -->
<!-- Whichever child row I refresh, only that would be changed, alonside the parent -->
</div>
And finally, my child controller:
<?php
namespace App\Livewire;
use Livewire\Component;
class SayHi extends Component
{
public $contact;
public function mount(Contact $contact)
{
$this->contact = $contact;
}
public function render()
{
return view('livewire.say-hi');
}
}
you render
public function render()
{
return view('livewire.hello-world'', ['modelo' => $this->modelo]);
}
Please or to participate in this conversation.