admin管理员组文章数量:1244420
In Laravel 11 with Livewire 3 I need to pass a public variable $navActive from my component to the layout. I do it like any variable to the view but I get an error. The Livewire3 documentation is very general and does not talk about this. I have tried using {{ $slot }} and #[Layout('layouts.app')] but nothing. The variable does not reach the layout. My code:
public $navActive = 'profesionales';
public function render()
{
return view('livewire.profesionales.profesionales-component')->extends('layouts.app');
}
View livewire.profesionales.profesionales-component:
<div class="row align-items-center">
@include('partials.mostrar-filas',['var' => 'numberRows'])
@include('partials.barra-busqueda', ['var' => 'search'])
@include('partials.show-active', ['model' => 'model_active', 'text' => 'Ocultar inactivos'])
</div>
The layout
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ config('app.name') }}</title>
<!-- boostrap5 -->
<link href="/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<link href=".css" rel="stylesheet">
<!-- Favicon -->
<link rel="icon" href="{{ asset('images/favicon.ico') }}" type="image/x-icon">
<!-- Scripts -->
@vite([ 'resources/css/app.css', 'resources/js/app.js'])
@livewireStyles
<!--jquery-->
<script src=".7.1/jquery.min.js" integrity="sha512-v2CJ7UaYy4JwqLDIrZUI/4hqeoQieOmAZNXBeQyjo21dadnwR+8ZaIJVT8EE2iyI61OV8e6M8PP2/4hpQINQ/g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<!-- summernote -->
<link href="/[email protected]/dist/summernote-lite.min.css" rel="stylesheet">
<script src="/[email protected]/dist/summernote-lite.min.js"></script>
<body>
<div class="d-flex">
{{ $navActive }}
@include('livewire.includes.toast')
@include('partials.sidebar')
<div id="main-content" class="content flex-grow-1">
@include('partials.navbar')
<!-- Page Content -->
<main>
<div class="container-fluid">
@yield('content')
</div>
</main>
</div>
</div>
@livewireScripts
<script data-navigate-once src="/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
</body>
</html>
In Laravel 11 with Livewire 3 I need to pass a public variable $navActive from my component to the layout. I do it like any variable to the view but I get an error. The Livewire3 documentation is very general and does not talk about this. I have tried using {{ $slot }} and #[Layout('layouts.app')] but nothing. The variable does not reach the layout. My code:
public $navActive = 'profesionales';
public function render()
{
return view('livewire.profesionales.profesionales-component')->extends('layouts.app');
}
View livewire.profesionales.profesionales-component:
<div class="row align-items-center">
@include('partials.mostrar-filas',['var' => 'numberRows'])
@include('partials.barra-busqueda', ['var' => 'search'])
@include('partials.show-active', ['model' => 'model_active', 'text' => 'Ocultar inactivos'])
</div>
The layout
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ config('app.name') }}</title>
<!-- boostrap5 -->
<link href="https://cdn.jsdelivr/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr/npm/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet">
<!-- Favicon -->
<link rel="icon" href="{{ asset('images/favicon.ico') }}" type="image/x-icon">
<!-- Scripts -->
@vite([ 'resources/css/app.css', 'resources/js/app.js'])
@livewireStyles
<!--jquery-->
<script src="https://cdnjs.cloudflare/ajax/libs/jquery/3.7.1/jquery.min.js" integrity="sha512-v2CJ7UaYy4JwqLDIrZUI/4hqeoQieOmAZNXBeQyjo21dadnwR+8ZaIJVT8EE2iyI61OV8e6M8PP2/4hpQINQ/g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<!-- summernote -->
<link href="https://cdn.jsdelivr/npm/[email protected]/dist/summernote-lite.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr/npm/[email protected]/dist/summernote-lite.min.js"></script>
<body>
<div class="d-flex">
{{ $navActive }}
@include('livewire.includes.toast')
@include('partials.sidebar')
<div id="main-content" class="content flex-grow-1">
@include('partials.navbar')
<!-- Page Content -->
<main>
<div class="container-fluid">
@yield('content')
</div>
</main>
</div>
</div>
@livewireScripts
<script data-navigate-once src="https://cdn.jsdelivr/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
</body>
</html>
1 Answer
Reset to default 0The documentation shows a specific example of how you can define other named slots from your layout, to be populated from your Livewire component.
In your layout, you have {{ $navActive }}, which means that you can define your view like this, where you name a slot from your component with the name of the slot in the layout you are referencing. The content inside the slot will be rendered in the layout.
<x-slot name="navActive">
Content from component: {{ $navActive }}
</x-slot>
<div class="row align-items-center">
@include('partials.mostrar-filas',['var' => 'numberRows'])
@include('partials.barra-busqueda', ['var' => 'search'])
@include('partials.show-active', ['model' => 'model_active', 'text' => 'Ocultar inactivos'])
</div>
版权声明：本文标题：laravel livewire - livewire3 how to pass a public variable from the component to the layout - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1740222162a2244021.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论