[SOLVED] Livewire 2.2: Undefined variable slot in app.blade.php

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

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 ?

Solution

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>