时间戳

首页 > 解决方案 > Laravel/Livewire/x-components 如何传递数组？

php - Laravel/Livewire/x-components 如何传递数组？

问题描述

我有一个解决方案，但我认为这很可怕，所以我想问你是否有更好（或正确）的方法

我需要创建一个<select>我将在我的应用程序周围的很多地方使用的。这<select>是您所期望的：

<select name="xxx">
    <option value="">...</option>
    @foreach ($equipos as $equipo)
        <option value="{{ $equipo->id }}">
            {{ $equipo->equipo }}
        </option>
    @endforeach
</select>

第一次尝试

所以，我的第一次尝试是使用一个组件<x-select-equipos>，组件视图将是：

<select {{ $attributes->merge(['class' => 'w-full']) }}>
    <option value="">...</option>
    @foreach ($equipos as $equipo)
        <option value="{{ $equipo->id }}">
            {{ $equipo->equipo }}
        </option>
    @endforeach
</select>

所以我想我可以这样称呼这个组件：

<x-select-equipos name="xxx" equipos="{{ $equipos }}" />

但我无法将$equipos集合传递给组件。如果我这样做，它只会发送一个true

第二次尝试

在我的第二次尝试中，我编写了一个 Livewire 组件，但它限制了我使用 Laravel 的 ORM，所以我“渲染”<option>了组件（.php）中的所有 s，并将它们显示在 .blade.php 中

这个解决方案的另一个问题是，每次我必须显示 a 时我都必须调用数据库<select>，这是次优的（更多内容见下文）

我的“解决方案”

我有点不喜欢它，但它有效，我创建了一个<x-component>类似的东西：

<div>
    @php
        use App\Models\Equipo;
        $equipos = Equipo::orderBy('nombre')->get();
    @endphp

    <select {{ $attributes->merge(['class' => 'w-full']) }}>
        <option value="">...</option>
        @foreach ($equipos as $equipo)
            <option value="{{ $equipo->id }}">
                {{ $equipo->nombre }}
            </option>
        @endforeach
    </select>
</div>

该解决方案有很多我不喜欢的地方，除其他外，它每次必须渲染时都必须转到数据库<option>，有一个屏幕我必须加载 30selects左右。虽然记录的数量非常少（大约 40 条），但我仍然不喜欢它，因为我觉得它效率很低。

其他可能的解决方案是回到将使用“partials”或的 Laravel/PHP 基础知识，@include这会很好，因为它只会进入数据库一次，实际上我在以前的版本中就是这样做的，我想尝试新方法，无论<x-components>是LiveWire

我完全确定一定有更好的方法。

标签： phplaravellaravel-livewire

解决方案

但我不能将 $equipos 集合传递给组件。如果我这样做，它只会发送一个真实的

是$equipos不是雄辩的合集？您应该能够将集合传递给您的组件。

传递一个集合以及用于指定模型上的哪些字段用于值和标签的道具怎么样？

@props([
    'items', 'value', 'label'
])

<select>
    <option value="">{{ __('Please select an option ...') }}</option>
    @foreach ($items as $item)
    <option value="{{ $item->$value }}">{{ $item->$label }}</option>
    @endforeach
</select>

然后您应该能够按如下方式调用您的组件（例如）：

<x-select :items="User::all()" value="id" label="email" />

推荐阅读