foreach 具有动态数据的刀片视图组件

Question

i am trying to loop over blade component by passing an array data. it successfully compiled but it is not showing up in the browser and also not giving an error

here is card.blade.php file

<div>
    <h1>{{$name}}</h1>
    <h2>{{$age}}</h2>
    <h3>{{$work}}</h3>
</div>

here is main file view file

    @php
        $arr = [
           
            ['name'=>'1','age'=>'2','work'=>'3'],
            
            ['name'=>'4','age'=>'5','work'=>'6']
        ];
    @endphp

@foreach ($arr as $de)

    <x-card :name={{$de['name']}} :age={{$de['age']}} :work={{$de['work']}}/>
    
@endforeach 

it also shows attached data when i click view source file

    <x-card :name=1 :age=2 :work=3/>
    

    <x-card :name=4 :age=5 :work=6/>

but i is not showing up in the browser, browser is blank

Answer 1

You just need to delete {{}} syntax from the attributes

 <x-card :name="$de['name']" :age="$de['age']" :work="$de['work']"/>

for more info check the Component-Attributes from the docs