Livewire 2.2: Undefined variable slot in app.blade.php

Question

I am using livewire 2.2 with laravel 7.24 in my laravel project. When i load component using

Route::get('/path', ComponentClassPath);

it works, but when i load my livewire component inside a blade view. For instance, test.blade.php like this:

@extends('layouts.app')

@section('content')
    @livewire("my-livewire-component")
@endsection

it doesn't work and shows the below error:

Undefined variable: slot (View: E:\xampp\htdocs\lw\resources\views\layouts\app.blade.php) .

app.blade.php

<head>
   @livewireStyles
</head>
<body>
   <div class="container">
       {{ $slot }}
   </div>

   @livewireScripts
</body>

Any solution ?

Can you share your ComponentClassPath too

Encang Cutbray
– Encang Cutbray

2020-09-27 11:59:07 +00:00
Commented Sep 27, 2020 at 11:59 — Encang Cutbray
– Encang Cutbray, Commented Sep 27, 2020 at 11:59

Qirel · Accepted Answer · 2020-09-27 12:43:18Z

14

Since you're using the @section directive (where you @extend a layout, and use sections), and not the component $slot approach (see https://laravel.com/docs/8.x/blade#slots), you should be using @yield instead of echoing the "special" $slot variable.

Alternatively you could go with the slots-approach, but you would generally choose one or the other. Going with that approach means a different structure to your blade files, and there's nothing wrong with either way -- just be consistent about which one you choose.

To continue using sections and extending layouts, simply replace {{ $slot }} with @yield('content'), like

<div class="container">
    @yield('content')
</div>

answered Sep 27, 2020 at 12:43

Qirel

26.6k7 gold badges54 silver badges71 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

MUHAMMAD Siyab Over a year ago

I followed a video tutorial in which they used both at same time. I think that's in version 1.x. Right?

MUHAMMAD Siyab Over a year ago

If i replace $slot with yield('content'), the error goes and the blade files are rendered well. But the issue is the component rendered directly by livewire (not blade) has nothing in it, just empty.

Yustina Yasin Over a year ago

@MUHAMMADSiyab me too

shasi kanth Over a year ago

In your Livewire component, hope you are rendering this way: return view('livewire.componentName')->extends('layouts.app');

Kaxa · Accepted Answer · 2023-09-21 07:21:41Z

2

instead of

@extends('layouts.app')

I found that laravel 10 uses x-app-layout

<x-app-layout>
Some content here...
</x-app-layout>

answered Sep 21, 2023 at 7:21

Kaxa

5651 gold badge8 silver badges13 bronze badges

Comments

KEKUATAN · Accepted Answer · 2022-10-18 17:25:43Z

1

If you still want to use slot please create component php artisan make:component Layouts/Login and on render function in Livewire controller Http/Livewire/... add layout

public function render()
    {
        return view('livewire.pages.login')
            ->layout('components.layouts.login');
    }

answered Oct 18, 2022 at 17:25

KEKUATAN

9587 silver badges21 bronze badges

Comments

Vatsal Shah · Accepted Answer · 2024-11-29 05:23:31Z

0

This Error is occurred because in your normal page livewire slot variable is not found so here is the solution you may try with your code.

@if (!empty($slot))
  {{ $slot }}
@else
  @yield('content')
@endif

In my case i wanted to load content if slot is not found.

answered Nov 29, 2024 at 5:23

Vatsal Shah

3452 silver badges6 bronze badges

Collectives™ on Stack Overflow

Livewire 2.2: Undefined variable slot in app.blade.php

4 Answers 4

4 Comments

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

4 Comments

Comments

Comments

Comments

Linked

Related