Laravel组件,如何检查一个 prop 时,它是不是在组件通知

cl25kdpy  于 2023-02-10  发布在  其他
关注(0)|答案(2)|浏览(123)

我试图弄清楚如果/props变量没有被传递,如何对其进行检查。
例如,在我的组件中,我有一些属性需要检查真假,如果我不将这些属性传递给组件,它就会抛出错误。
有人能告诉我怎么检查吗?
我将在下面的代码中给出一个示例。

<x-banner-introduction titleBefore="Blog" titleAfter="A voz do cliente" description="Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa, velit?" btnText="Confira aqui" btnUrl="/" hasSearchField="true" hasLikeShare="" class="mb-12">
</x-banner-introduction>
<section {{ $attributes->merge(['class' => 'c-bannerIntroduction']) }}>
    <div class="container">
        @if($isCarousel)
            <p>é carrossel</p>
        @endif

        @if($titleAfter)
        <h1 class="nv-title nv-title--smile nv-title--big text-white mb-3 mb-md-4">
            <span>{{$titleBefore}}</span>
            <img src="{{asset('/images/icons/smile--white.svg')}}" alt="Ícone sorriso">
            <strong>{{$titleAfter}}</strong>
        </h1>

        @else
            <h1 class="nv-title nv-title--smile nv-title--big text-white mb-3 mb-md-4">
            <strong>{{$titleBefore}}</strong>
          </h1>
        @endif

        @if($description)
        <div class="row mb-7">
            <div class="col col-12 col-lg-5">
                <p class="nv-text--description text-white">
                    {{ $description ?? null }}
                </p>
            </div>
        </div>
        @endif
        
        @if($btnText)
        <a href="{{$btnUrl}}" class="nv-btn nv-btn--small">
            {{$btnText}}
        </a>
        @endif

        @if($hasSearchField === "true")
        <form class="c-bannerIntroduction__divSearch c-form mt-10">
            <div class="row">
                <div class="col">
                    <fieldset class="c-form__formGroup">
                        <label class="c-form__formGroup__label d-none d-md-block" for="inputSearch">O que deseja
                            encontrar?</label>

                        <input class="c-form__formGroup__input d-none d-md-block" type="search" id="inputSearch"
                            placeholder="Digite palavras chaves" minlength="3" maxlength="255" required>
                        <input class="c-form__formGroup__input d-block d-md-none" type="search" id="inputSearch"
                            placeholder="O que deseja encontrar?" minlength="3" maxlength="255" required>
                    </fieldset>
                </div>

                <div class="col col-auto">
                    <button class="c-form__submitBtn nv-btn nv-btn--search">
                        <span>Buscar</span>
                    </button>
                </div>
            </div>
        </form>
        @endif

        @if($hasLikeShare === 'true')
        <div class="c-bannerIntroduction__likesSharesInfo mt-6">
            <div class="row">
              <div class="col col-12 col-md-6 mb-2 mb-md-0">
                <div class="c-bannerIntroduction__likesSharesInfo__info">
                  <div class="row align-content-center">
                    <div class="c-bannerIntroduction__likesSharesInfo__info__colImage col col-auto pr-0">
                      <img src="{{asset('/images/models/homem-branco-oculos-blusa-preta.jpeg')}}" class="c-bannerIntroduction__likesSharesInfo__info__colImage__illustrativePicture" alt="Imagem ilustrativa">
                    </div>
                    <div class="c-bannerIntroduction__likesSharesInfo__info__colImage col col-auto px-0">
                      <img src="{{asset('/images/models/homem-branco-oculos-blusa-preta.jpeg')}}" class="c-bannerIntroduction__likesSharesInfo__info__colImage__illustrativePicture" alt="Imagem ilustrativa">
                    </div>
                    <div class="c-bannerIntroduction__likesSharesInfo__info__colImage col col-auto px-0">
                      <img src="{{asset('/images/models/homem-branco-oculos-blusa-preta.jpeg')}}" class="c-bannerIntroduction__likesSharesInfo__info__colImage__illustrativePicture" alt="Imagem ilustrativa">
                    </div>
                    <div class="c-bannerIntroduction__likesSharesInfo__info__colImage col col-auto px-0">
                      <img src="{{asset('/images/models/homem-branco-oculos-blusa-preta.jpeg')}}" class="c-bannerIntroduction__likesSharesInfo__info__colImage__illustrativePicture" alt="Imagem ilustrativa">
                    </div>
                    <div class="c-bannerIntroduction__likesSharesInfo__info__colImage col col-auto px-0">
                      <img src="{{asset('/images/icons/heart--bgWhite--gray.svg')}}" class="c-bannerIntroduction__likesSharesInfo__info__colImage__illustrativePicture" alt="Ícone de coração">
                    </div>

                    <div class="col pl-2">
                      <div class="h-100 d-flex align-items-center">
                        <p class="c-bannerIntroduction__likesSharesInfo__info__text">
                          Amado e curtido por <strong>50 visitantes</strong>
                        </p>
                      </div>
                    </div>
                  </div>
                </div>
              </div>

              <div class="col col-12 col-md-6">
                <div class="c-bannerIntroduction__likesSharesInfo__info">
                  <div class="row align-content-center">
                    <div class="c-bannerIntroduction__likesSharesInfo__info__colImage col col-auto pr-0">
                      <img src="{{asset('/images/models/homem-branco-oculos-blusa-preta.jpeg')}}" class="c-bannerIntroduction__likesSharesInfo__info__colImage__illustrativePicture" alt="Imagem ilustrativa">
                    </div>
                    <div class="c-bannerIntroduction__likesSharesInfo__info__colImage col col-auto px-0">
                      <img src="{{asset('/images/models/homem-branco-oculos-blusa-preta.jpeg')}}" class="c-bannerIntroduction__likesSharesInfo__info__colImage__illustrativePicture" alt="Imagem ilustrativa">
                    </div>
                    <div class="c-bannerIntroduction__likesSharesInfo__info__colImage col col-auto px-0">
                      <img src="{{asset('/images/models/homem-branco-oculos-blusa-preta.jpeg')}}" class="c-bannerIntroduction__likesSharesInfo__info__colImage__illustrativePicture" alt="Imagem ilustrativa">
                    </div>
                    <div class="c-bannerIntroduction__likesSharesInfo__info__colImage col col-auto px-0">
                      <img src="{{asset('/images/models/homem-branco-oculos-blusa-preta.jpeg')}}" class="c-bannerIntroduction__likesSharesInfo__info__colImage__illustrativePicture" alt="Imagem ilustrativa">
                    </div>
                    <div class="c-bannerIntroduction__likesSharesInfo__info__colImage col col-auto px-0">
                      <img src="{{asset('/images/icons/share--bgWhite--gray.svg')}}" class="c-bannerIntroduction__likesSharesInfo__info__colImage__illustrativePicture" alt="Ícone de coração">
                    </div>

                    <div class="col pl-2">
                      <div class="h-100 d-flex align-items-center">
                        <p class="c-bannerIntroduction__likesSharesInfo__info__text">
                          Amado e compartilhado por <strong>80 visitantes</strong>
                        </p>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
        </div>
        @endif
    </div>


    {{$slot}}
</section>
<?php

namespace App\View\Components;

use Illuminate\View\Component;

class BannerIntroduction extends Component
{
    /**
     * Create a new component instance.
     *
     * @return void
     */

    public $isCarousel;
    public $titleBefore;
    public $titleAfter;
    public $description;
    public $btnText;
    public $btnUrl;
    public $hasSearchField;
    public $hasLikeShare;

    public function __construct($isCarousel, $titleBefore, $titleAfter, $description, $btnText, $btnUrl, $hasSearchField, $hasLikeShare)
    {
        $this->isCarousel = $isCarousel ? $isCarousel : 0;
        $this->titleBefore = $titleBefore;
        $this->titleAfter = $titleAfter;
        $this->description = $description;
        $this->btnText = $btnText;
        $this->btnUrl = $btnUrl;
        $this->hasSearchField = $hasSearchField;
        $this->hasLikeShare = $hasLikeShare;
    }

    /**
     * Get the view/contents that represent the component.
     *
     * @return \Illuminate\View\View|string
     */
    public function render()
    {
        return view('components.banner-introduction');
    }
}

在上面的例子中,"Carousel"没有通过,所以它在页面上给出了一个错误。
错误:

Illuminate\Contracts\Container\BindingResolutionException
Unresolvable dependency resolving [Parameter #0 [ <required> $isCarousel ]] in class App\View\Components\BannerIntroduction (View: C:\programming\gitlab\Smiles\766-desafio-cx\resources\views\home.blade.php)
xwmevbvl

xwmevbvl1#

你只需要为$isCarousel参数添加一个默认值,这样即使你没有传递一个值,它也不会抛出一个错误,你也不需要添加一个条件。

public function __construct($isCarousel = 0, ...)
{
    $this->isCarousel = $isCarousel;
}
tmb3ates

tmb3ates2#

你试过使用isset($prop)吗?
例如:
代替

@if($btnText)
    <a href="{{$btnUrl}}" class="nv-btn nv-btn--small">
       {{$btnText}}
    </a>
@endif

你可以试试

@if(isset($btnText))
    <a href="{{$btnUrl}}" class="nv-btn nv-btn--small">
        {{$btnText}}
    </a>
@endif

相关问题