为什么我的laravel-livewire ->layout没有起作用?

huangapple go评论73阅读模式
英文:

Why is my laravel-livewire ->layout not working?

问题

我正在尝试使用Livewire模型为我的页面应用样式,但它不起作用,我找不到原因。以下是我的模型代码:

<?php

namespace App\Http\Livewire;

use Livewire\Component;

class Home extends Component
{
  public function render()
  {
    return view('livewire.home')
        ->layout('layouts.tesswimlayout');
  }
}

布局文件:

<!doctype html>
<html lang="nl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://unpkg.com/alpinejs" defer></script>
<meta name="description" content="Welkom bij TS">
<title>TS: {{ $title ?? '' }}</title>
@vite(['resources/css/app.css', 'resources/js/app.js'])
@livewireStyles
</head>

<body class="font-sans antialiased">
<div class="flex flex-col space-y-4 min-h-screen text-gray-800 bg-gray-100">
<header class="shadow bg-white/70 sticky inset-0 backdrop-blur-sm z-10">
    {{--  Navigation  --}}
    <nav class="container mx-auto p-4 flex justify-between items-center">
        <a href="{{ route('home') }}" class="underline">Home</a>
    </nav>
</header>
<main class="container mx-auto p-4 flex-1 px-4">

    {{-- Main content --}}
    {{ $slot }}
</main>
<x-layout.footer.footer/>
</div>
@stack('script')
</body>
</html>

我确定这是一个简单的错误,但我目前完全迷失,所以任何帮助都会感激。

英文:

i'm trying to apply a style to my page using a Livewire model but it does not work and i can't find why.
Here is the code of my model:

&lt;?php

namespace App\Http\Livewire;

use Livewire\Component;

class Home extends Component
{
  public function render()
  {
    return view(&#39;livewire.home&#39;)
        -&gt;layout(&#39;layouts.tesswimlayout&#39;);
  }
}

Layout File

&lt;!doctype html&gt;
&lt;html lang=&quot;nl&quot;&gt;
&lt;head&gt;
&lt;meta charset=&quot;UTF-8&quot;&gt;
&lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial- 
scale=1.0&quot;&gt;
&lt;script src=&quot;https://cdn.tailwindcss.com&quot;&gt;&lt;/script&gt;
&lt;script src=&quot;https://unpkg.com/alpinejs&quot; defer&gt;&lt;/script&gt;
&lt;meta name=&quot;description&quot; content=&quot;Welkom bij TS&quot;&gt;
&lt;title&gt;TS: {{ $title ?? &#39;&#39; }}&lt;/title&gt;
@vite([&#39;resources/css/app.css&#39;, &#39;resources/js/app.js&#39;])
@livewireStyles
&lt;/head&gt;

&lt;body class=&quot;font-sans antialiased&quot;&gt;
&lt;div class=&quot;flex flex-col space-y-4 min-h-screen text-gray-800 
bg-gray-100&quot;&gt;
&lt;header class=&quot;shadow bg-white/70 sticky inset-0 backdrop-blur-sm 
z-10&quot;&gt;
    {{--  Navigation  --}}
    &lt;nav class=&quot;container mx-auto p-4 flex justify-between items- 
center&quot;&gt;
        &lt;a href=&quot;{{ route(&#39;home&#39;) }}&quot; class=&quot;underline&quot;&gt;Home&lt;/a&gt;
    &lt;/nav&gt;
&lt;/header&gt;
&lt;main class=&quot;container mx-auto p-4 flex-1 px-4&quot;&gt;

    {{-- Main content --}}
    {{ $slot }}
&lt;/main&gt;
&lt;x-layout.footer.footer/&gt;
&lt;/div&gt;
@stack(&#39;script&#39;)
&lt;/body&gt;
&lt;/html&gt;

I'm sure it's a simple mistake but i'm totally lost atm so any help is apreciated.

答案1

得分: 0

我忘记在我的布局中添加@LivewireScripts。感谢那些尝试帮助的人。

英文:

It was simple after all, I forgot to add @LivewireScripts to my layout. Thanks to those who tried to help.

huangapple
  • 本文由 发表于 2023年6月25日 21:17:05
  • 转载请务必保留本文链接:https://go.coder-hub.com/76550592.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定