如何解决组件中的 Livewire x 槽标记
我搜索在 Livewire 组件中使用 x-slot 来填充我的侧边栏与 wire:model 表单输入。
<x-app-layout>
<x-slot name="header">
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
{{ __('Header') }}
</h2>
</x-slot>
<div>{{ $sidebar }}</div>
<div class="bg-white">
<livewire:editor-component :post="$post" />
</div>
</x-app-layout>
我的 Livewire 组件:
<div>
<x-slot name="sidebar">
<div class="bg-gray-100">
Some text... Some inputs...
</div>
</x-slot>
<div class="p-5">
<livewire:other-component />
</div>
</div>
还有我的组件:
<?PHP
namespace App\Http\Livewire;
use App\Models\Post;
use Livewire\Component;
class EditorComponent extends Component
{
/** @var Post */
public $post;
}
我想访问侧边栏 x-slot 中的 $post,我应该能够从侧边栏中写入输入和管理组件的值。
解决方法
您可以直接访问 Livewire 视图中的 $post
,因为它是公共属性。
例如,您可以输出您的 $post
的 ID,因为您的 id
上有一个 $post
属性,如下所示:
<div>
<x-slot name="sidebar">
<div class="bg-gray-100">
Some text... Some inputs...
</div>
</x-slot>
Post id: {{ $post->id }}
<div class="p-5">
<livewire:other-component />
</div>
</div>
如何访问属性写在Livewire docs
跨组件访问属性,可以通过使用 Livewire Events
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。