如何将数组传递给laravel 5.4中的@slot？

Question

我试图在我的布局中使用它,我突然想到使用Laravel 5.4 @slot的新功能.

只是想知道是否可以将阵列传递到插槽？

        @section('SampleSection')

            @component( 'mylayouts.partials.contentheader' )

                @slot('title')
                    Sample Title
                @endslot

                @slot('indexes')
                    Pass array here  // example [ 'a', 'b', 'c' ]
                @endslot

            @endcomponent

        @endsection

Answer 1

据我所知,无法将数组传递给组件@slot.但是,它是可以通过和阵列直接的成分,不使用的槽.

从文档:

将其他数据传递给组件

有时您可能需要将其他数据传递给组件.因此,您可以将数据数组作为第二个参数传递给@component指令.所有数据都将作为变量提供给组件模板:

@component('alert', ['foo' => 'bar'])
    ...
@endcomponent

所以假设你有一组数据:

$my_array = ['a', 'b', 'c']

您可以将它传递给组件,如下所示:

@component('mylayouts.partials.contentheader', ['my_array' => $my_array])
    ...
@endcomponent

或者你可以直接传递它,而不使用变量:

@component('mylayouts.partials.contentheader', ['my_array' => ['a', 'b', 'c']])
    ...
@endcomponent

然后,在组件文件中,您将可以访问$my_array变量.例如,在您的contentheader.blade.php文件中,您可以执行以下操作:

<ul>
    @foreach($my_array as $value)
        <li>{{ $value }}</li>
    @endforeach
</ul>

Answer 2

我需要同样的东西.

这可以作为暂时的解决方案,但不是最好的形式.

@component('component.tab.header')
    @slot('navs', [
        "a" => "Pepe",
        "b" => "Maria"
    ])
@endcomponent

编辑:

最后,就我而言,我解决了这个问题:

@component('component-name')
    @slot('slot-name')
        Value1|Value2|Value2
    @endslot
@endcomponent

并在组件代码中:

@foreach(explode('|', $slot-name) as $value)
    The value is {{ $value }} <br/>
@endforeach

Answer 3

这是一个示例组件。将项目数量分配给$numberOfSlots变量，它将一一搜索槽块（body_1, body_2, body_3）

因为我构建了一个表单向导，并且在其之间定义 html 块太难看了，" "所以我更喜欢@slot.

成分：

<div class="component">
    @for($i = 1; $i <= $numberOfSlots; $i++)
        <div class="item">
            {{ ${"body_{$i}"} }}
        </div>
    @endfor
</div>

刀刃：

@component(['numberOfSlots' => 3])
    @slot('body_1')
            Dynamically created slot 1
    @endslot

    @slot('body_2')
            Dynamically created slot 2
    @endslot

    @slot('body_3')
            Dynamically created slot 3
    @endslot
@endcomponent