Created
July 31, 2023 06:21
-
-
Save tushargugnani/ffd194a53f065bccd29e2f7041d42805 to your computer and use it in GitHub Desktop.
Livewire Parent Child Modelable Property
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /*Parent Component */ | |
| <?php | |
| namespace App\Livewire; | |
| use Livewire\Component; | |
| class ParentComponent extends Component | |
| { | |
| public $foo; | |
| public function render() | |
| { | |
| return view('livewire.parent-component'); | |
| } | |
| } | |
| /** parent-component.blade.html **/ | |
| <div class="container mx-auto max-w-lg"> | |
| <livewire:child-component wire:model="foo"/> | |
| {{$foo}} | |
| </div> | |
| Child Component | |
| <?php | |
| namespace App\Livewire; | |
| use Livewire\Component; | |
| use Livewire\Attributes\Modelable; | |
| class ChildComponent extends Component | |
| { | |
| #[Modelable] | |
| public $bar; | |
| public function render() | |
| { | |
| return view('livewire.child-component'); | |
| } | |
| } | |
| /** child-component.blade.php **/ | |
| <div> | |
| <div class="my-2"> | |
| <label class="text-sm block text-gray-800">Full Name</label> | |
| <div class="mt-1"> | |
| <input wire:model.live="bar" type="text" name="example-text-input" placeholder="Enter your fullname" class="border border-gray-300 focus:outline-blue-400 rounded w-full h-8 p-3 text-sm"> | |
| </div> | |
| </div> | |
| </div> | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment