使用刀片 (Livewire) 调用动态内容

Posted 2023-03-14

【中文标题】使用刀片 (Livewire) 调用动态内容

【英文标题】：Calling dynamic content with blade (Livewire)

【发布时间】：2021-10-22 22:12:19

【问题描述】：

我在一个项目中使用laravel-modules。我还在项目中添加了laravel-modules-livewire，并使用它在我的仪表板中调用动态内容以允许配置每个模块。按照我的设计方式，每个模块都会有一个配置 livewire 组件，应该在帐户设置部分调用该组件，以允许每个客户端配置模块的行为方式。

在我的Account/Moduleslivewire 中，我在 mount 方法中有这个：

    public $client;
    public $modules;

    public function mount( Client $client )
    
        $this->client  = $client;
        $this->modules = $client->getModules();
    

$client->getModules 检索客户端活动的模块集合。根据nWidart/Laravel-Modules，你可以用$module->getName()得到模块的名字，你也可以用$module->getLowerName()得到小写的名字。根据 mhmiton/laravel-modules-livewire，您应该使用 <livewire:module-lower-name::component-class-kebab-case /> 在模块内渲染您的 livewire 组件。所以我在我的account/modules刀片中写了以下内容：

        @foreach($modules as $module)
            <livewire: $module->getName() ::configuration :client="$client" />
        @endforeach

我也试过

        @foreach($modules as $module)
            <livewire: $module->getLowerName() ::configuration :client="$client" />
        @endforeach

但是他们都没有得到我的配置组件的渲染。最后我不得不将我的代码切换到替代符号

        @foreach($modules as $module)
            @livewire( $module->getLowerName() . '::configuration', [ 'client' => $client ] )
        @endforeach

这次它被正确渲染了。我不想使用这种表示法，有人可以向我解释错误在哪里吗？如何让它们使用第一种表示法呈现？

【参考方案1】：

您可以使用 Livewire 的动态组件来实现它。但是两者在功能上是相等的，所以使用任何一个应该都没有问题。

在我们深入了解动态组件之前，建议您使用wire:key 来键入每个动态组件，这应该是独一无二的。

添加密钥后，您的工作解决方案将如下所示

@livewire($module->getLowerName() . '::configuration', ['client' => $client], key($loop->index))

如果你想使用<livewire 标签，你可以使用is 组件来实现，

<livewire:is :component="$module->getLowerName() . '::configuration'" :client="$client" :wire:key="$loop->index" />

【讨论】：

我将答案标记为正确，因为答案的第一部分是正确的，并且对于大多数动态加载的 livewire 组件，livewire:is 方法工作正常。但是 :component="$module->getLowerName . '::configuration'" 不起作用，原因是要在 :component 内部调用一个类，您需要像这样使用单引号： :component="' SomeClass::some.component'" 当然不可能那样做。我什至尝试使用' '，但它从来没有奏效。但最终这是最有帮助的答案（也是唯一的答案）