Livewire 组件显示自己的代码但不呈现

Question

我正在使用 Laravel Jetstream 和 Livewire。我正在尝试根据文档制作自己的 Livewire 组件：

php artisan livewire:make my_component

默认情况下它位于resources/views/livewire/my-component.blade.php。我将此字符串添加到resources/views/profile/show.blade.php 文件：@livewire('my-component')。我想在用户个人资料页面中看到这个组件。

但是我只在页面上看到它的代码而不是组件。

在这张图片中，我添加了我的组件而不是 two-factor-authentication-form.blade.php。这是resources/views/liwevire/my-component.blade.php的代码：

<x-jet-action-section>
    <x-slot name="title">
        {{ __('Two Factor Authentication') }}
    </x-slot>

    <x-slot name="description">
        {{ __('Add additional security to your account using two factor authentication.') }}
    </x-slot>

    <x-slot name="content">
        Some content
    </x-slot>

</x-jet-action-section>

这是resources/views/profile/show.blade.php的一段代码：

@if (Laravel\Fortify\Features::canManageTwoFactorAuthentication())
    <div class="mt-10 sm:mt-0">
        <!-- @livewire('profile.two-factor-authentication-form') -->
        @livewire('my-component')
    </div>
    <x-jet-section-border />
@endif

我该如何解决？

P。 S. 我已经从resources/views/profile/show.blade.php 中删除了评论行，但仍然没有。代码如下：

@if (Laravel\Fortify\Features::canManageTwoFactorAuthentication())
    <div class="mt-10 sm:mt-0">
        @livewire('my-component')
    </div>
    <x-jet-section-border />
@endif

结果：

附言这是app/Http/Livewire/MyComponent的代码：

<?php

namespace App\Http\Livewire;

use Livewire\Component;

class MyComponent extends Component
{
    public function render()
    {
        return view('livewire.my-component');
    }
}

Answer 1

使用 HTML cmets 注释掉刀片渲染组件时要小心，因为它仍然会在 cmets 之间渲染刀片组件

<!-- @livewire('profile.two-factor-authentication-form') -->

使用 {{-- --}}

{{-- @livewire('profile.two-factor-authentication-form') --}}