0

我有一个组件表

<x-table :rows="$rowsArray"></x-table>

我传递数组数组，其中每个内部数组代表<tr>要打印的行。

$rowsArray = [
  ['name'=>'Marko', 'age'=>21],
  ['name'=>'John', 'age'=>33]
]

在组件table.blade.php内部：我将每个值打印为简单文本

<table>
    @foreach($rowsArray as $tr)
        <tr>
            @foreach($tr as $td_key => $td_value)
                <td>
                    {{ $td_value }}
                </td>
            @endforeach
        </tr>
    @endforeach
</table>

由于它只是打印字符串文本，因此对于我希望在内部打印不同布局的情况，我<td>通过插槽$customSlot传递布局。

通过插槽调用具有自定义布局的组件

硬编码示例 ->

<x-table :rows="$rowsArray">
  <x-slot name="customSlot">
    <div class="flex">
      <span>
          Marko
      </span>
      <span>
          21 age
      </span>
    </div>
  </x-slot>
</x-table>

所以更新table.blade.php中的代码 我正在检查插槽是否通过，如果没有打印字符串文本。

<table>
    @foreach($rowsArray as $tr)
        <tr>
            @foreach($tr as $td_key => $td_value)
                <td>
                    @if(isset($customSlot))
                        {{ $customSlot }}
                    @else
                        {{ $td_value }}
                    @endif
                </td>
            @endforeach
        </tr>
    @endforeach
</table>

问题： 我想在插槽范围内访问$tr当前foreach迭代的数据，而不是打印硬编码值。

这里$tr['name']和$tr['age']是未定义的，我希望它可以从当前迭代中访问：

<x-slot name="customSlot">
    <div class="flex">
        <span>
            {{ $tr['name'] }}
        </span>
        <span>
            {{ $tr['age'] }} age
        </span>
    </div>
</x-slot>

投掷

$tr is undefined

传递数组的预期输出：

<table>
    <tr>
        <td>
            <div class="flex">
                <span>Marko</span>
                <span>21 age</span>
            </div>
        </td>
        <td>
            <div class="flex">
                <span>John</span>
                <span>33 age</span>
            </div>
        </td>
    </tr>
</table>
4

0 回答 0