Component InputError.php
<?php
namespace App\View\Components;
use Illuminate\View\Component;
class InputError extends Component
{
/**
* Create a new component instance.
*
* @return void
*/
public function __construct()
{
//
}
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|\Closure|string
*/
public function render()
{
return view('components.input-error');
}
}
Blade input-error.blade.php
@props(['for'])
@error($for)
<label {!! $attributes->merge(['class' => 'error']) !!}>
{{ $message }}
</label>
@enderror
Blade View
<x-input-error for="title" />
Errors
Undefined variable: for
i'm not want change original jetstream component, how can i fix it?
CodePudding user response:
From the docs:
You should define the component's required data in its class constructor. All public properties on a component will automatically be made available to the component's view. It is not necessary to pass the data to the view from the component's render method: (...)
So, in your case:
class InputError extends Component
{
public $for;
public function __construct($for)
{
$this->for = $for;
}
public function render()
{
return view('components.input-error');
}
}
Then you should be able to pass data:
<x-input-error for="my-title" />
PS: I think the issue is with the use of the @prop
directive. The directive is used in anonymous components that don't have a dedicated component class linked to the view. I almost always use anonymous components so I cannot be fully sure of this behaviour.
PS2: In your <label>
tag use the {{ }}
instead of {!! !!}