Home » Php » php – How to pass an array to a @slot in laravel 5.4?

php – How to pass an array to a @slot in laravel 5.4?

Posted by: admin July 12, 2020 Leave a comment

Questions:

I am trying to use it in my layout and I’m suddenly bump-up with the idea of using the new features of Laravel 5.4 @slot.

Just wondering if passing an array to a slot possible?

        @section('SampleSection')

            @component( 'mylayouts.partials.contentheader' )

                @slot('title')
                    Sample Title
                @endslot

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

            @endcomponent

        @endsection
How to&Answers:

As far as I know, it isn’t possible to pass an array to a component via @slot. However, it is possible to pass and an array to a component directly, without using a slot.

From the documentation:

Passing Additional Data To Components

Sometimes you may need to pass additional data to a component. For
this reason, you can pass an array of data as the second argument to
the @component directive. All of the data will be made available to
the component template as variables:

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

So let’s say you have an array of data:

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

You can pass it to the component like so:

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

Or you can just pass it directly, without using a variable:

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

Then, within your component file, you will have access to a $my_array variable. For example, in your contentheader.blade.php file you can do this:

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

Answer:

I need the same.

This works as a temporally solution, but is not the best form for do it.

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

EDIT:

Finally, in my case, I solved doing this:

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

And in the component code:

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

Answer:

Here is a sample component. Assign number of items to $numberOfSlots variable and it will search for slot blocks one by one (body_1, body_2, body_3)

Because I build a form wizard and it’s too ugly to define html blocks between " " so I prefer @slot.

Component:

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

Blade:

@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

Answer:

I may be wrong but couldn’t you just pass the data to the component and handle that in the component? Docs show

Sometimes you may need to pass additional data to a component. For this reason, you can pass an array of data as the second argument to the @component directive. All of the data will be made available to the component template as variables:

@component(‘alert’, [‘foo’ => ‘bar’])

@endcomponent

deal with the data in the component instead of using a slot?

Answer:

it’s so simple and easy send array into component template without any @slot
in view page

view.blade.php

@component('components.button',[
  'tooltipTitle'=>'buttorr33',
  'addStyle'=>'pointer',
  ])
  @endcomponent

in component php file component\button.php

<div class="block-buttons {{$addStyle or NULL}}"
     {{--if set tooltip, add atributes--}}
     @if (isset($tooltipTitle))...

Answer:

How I do it:

Include @PageNav component tag in any view

@PageNav([
    'menus' => [
        [
            'title' => 'foo', 
            'url' => '/foo/index'
        ], 
        [
            'title' => 'bar', 
            'url' => '/bar/page'
        ]
    ]
]) @endPageNav

Create view/components/PageNav.php file

@foreach ($menus as $menu)
  <li class="nav-item">
    <a class="nav-link" href="{{ $menu['url'] }}">{{ $menu['title'] }}</a>
  </li>
@endforeach

Register the component: (AppServiceProvider.php -> Boot)

Blade::component('components.PageNav'); // "/views/components/PageNav.php"

Hope it’s help!