livewire/volt
Auf GitHub ansehenCould not find Livewire component in DOM tree when using Volt full-page
Open
#130 geöffnet am 30. Jan. 2025
help wanted
Repository-Metriken
- Stars
- (420 Stars)
- PR-Merge-Metriken
- (Keine gemergten PRs in 30 T)
Beschreibung
Volt Version
1.6.6
Laravel Version
11.37.0
PHP Version
8.3.13
Database Driver & Version
No response
Description
When using Volt's full-page component within Blade section directive I cannot get $wire to work in JavaScript as it can't find current component.
Could not find Livewire component in DOM tree
Steps To Reproduce
- Create simple layout
resources/views/layouts/bare.blade.php
<!DOCTYPE html>
<html>
<head>
<body>
@yield('body')
</body>
</html>
- Create Volt component
resources/views/livewire/email.blade.php
<?php
use function Livewire\Volt\{layout, state};
layout('layouts.bare');
state('email', 'test@example.com');
?>
<div>
@section('body')
<p x-data="{
email: $wire.$get('email')
}">Your email is: <span x-text="email"></span></p>
@endsection
</div>
- Add routing in
routes/web.php
<?php
use Livewire\Volt\Volt;
Volt::route('/email', 'email');
Because our alpine component is within blade's @section directive, it cannot find current Livewire component.