尝试使用 Livewire 3 在 Laravel 上渲染刀片组件时出现“未定义的变量 $slot”

问题描述 投票：0回答：1

您好，我做了一个新项目来看看为什么我在使用 Livewire 3 组件渲染刀片时遇到问题。我有我的 

app.blade.php
和带有 
counter.blade.php
livewire 组件的 
Counter
。

livewire 配置文件具有 

'layout' => 'components.layouts.app'
并遵循 livewire 文档进行布局，但仍然存在 
Undefined variable $slot
错误。想尽一切办法来解决。

app.blade.php
位于
resources/views/components/layouts/app.blade.php

app.blade.php

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">

<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0">

    <title>{{ $title ?? 'Page Title' }}</title>
    @vite(['resources/css/app.css', 'resources/js/app.js'])
</head>

<body>
    @if ($slot->isEmpty())
        This is default content if the slot is empty.
    @else
        {{ $slot }}
    @endif
</body>

</html>


counter.blade.php

<x-layouts.app>
<div>
    <h1>{{ $count }}</h1>
 
    <button wire:click="increment">+</button>
    
    <button wire:click="decrement">-</button>
</div>
</x-layouts.app>


Counter livewire component

<?php
 
namespace App\Livewire;
 
use Livewire\Component;
 
class Counter extends Component
{
    public $count = 1;
 
    public function increment()
    {
        $this->count++;
    }
 
    public function decrement()
    {
        $this->count--;
    }
 
    public function render()
    {
        return view('livewire.counter');
    }
}
php laravel components laravel-blade laravel-livewire
1个回答
0
投票

刀片组件如何与插槽配合使用

  1. Blade 组件中的 $slot 变量指的是您在组件标签之间传递的内容 (...)。
  2. 默认情况下，Blade 将处理空的或丢失的槽内容，而不需要像 @if ($slot->isEmpty()) 那样进行手动检查。
  3. 如果没有为该槽提供任何内容，它就保持为空，因此您可以直接渲染 {{ $slot }}。

在你的app.blade.php布局中，你可以去掉条件检查并直接使用：

<body>
   {{ $slot }}
</body>

如果你想在没有内容传递到槽位时显示默认内容，可以这样处理：

<body>
   {{ $slot ?? 'This is default content if the slot is empty.' }}
</body>
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.