如何在组件上动态添加数据属性？ （laravel）

Question

我的代码是这样的：

<div class="row no-gutter">
    <div class="col-md-3">
        <h2 class="nav-cat-text">By Types</h2>
    </div>
    <div class="col-md-9 col-xs-12">
        <div class="wrap-tabs">
            <ul class="nav nav-tabs nav-cat">
                @foreach($categories as $category)
                    <li role="presentation" class="{{ $loop->first ? 'active' : '' }}"><a href="javascript:;" data-toggle="tab" @click="$refs.player.getPlayer({{ $category->id }})">{{ ucfirst($category->name) }}</a></li>
                @endforeach
            </ul>
        </div>
    </div>
</div>
<br>
<!-- Tab panes -->
<div class="tab-content">
    <div role="tabpanel" class="tab-pane active">
        <top-player-view category_id="1" ref="player"></top-player-view>
    </div>
</div>

top-player-view中的

category_id属性是静态的

我想让它变得更有活力。所以，我希望在$ categories

的第一个循环中从category_id获取category_id属性

我该怎么做？

Answer 1

试试这个： [我只输入了改变的部分，你可以理解。]

@foreach($categories as $category)
<li> ... </li>
@php
if ($loop->first)
$variable = $category->id
@endphp
@endforeach
...
<top-player-view category_id="{{ $variable }}" ref="player"></top-player-view>