0

在 Laravel 7 中,我想使用一个匿名 Blade 组件,它可以接受动态和静态值作为属性。下面的代码应该解释我的意思:

// Scenario 1: dynamic values

<x-alert :type="session('alert.type')" :dismissable="session('alert.dismissable')">
  {{ session('alert.body') }}
</x-alert>


// Scenario 2: static values

<x-alert :type="'success'" :dismissable="'yes'">
  {{ $status }}
</x-alert>

和组件

<div class="alert alert-{{ $type }} {{ $dismissable == 'yes' ? 'alert-dismissible' : '' }} fade show" role="alert">

    {!! $slot !!}

    @if($dismissable == 'yes')
        <button type="button" class="close" data-dismiss="alert">
            <i class="fal fa-times"></i>
        </button>
    @endif

</div>

现在这工作正常,但我的问题是:当你想勾选所有这些框时,这样做是正确的方法:

  • 使用匿名组件
  • 为同一属性传递静态或动态变量(如示例中的:type:dismissable

文档对此并不完全清楚。

4

1 回答 1

1

您可以在使用组件时决定是通过 HTML 属性还是:前缀属性来传递值。

如果组件接收到动态值,请使用您提到的:

<x-alert :type="session('alert.type')" :dismissable="session('alert.dismissable')">
 {{ session('alert.body') }}
</x-alert>

如果组件接收到像硬编码字符串这样的原始值,请使用没有:前缀和单引号的 HTML 属性:

<x-alert type="success" dismissable="yes">
  {{ $status }}
</x-alert>

在这两种情况下$type$dismissable您的组件中都可以使用变量。

于 2020-03-05T15:01:25.263 回答