Variable undefined error in laravel blade component view

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?

>Solution :

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 {!! !!}