New to livewire, and trying to convert an existing form to a livewire component.

When I submit the form, I'm getting this error:

Typed property App\Http\Livewire\LocationInfo::$location must not be accessed before initialization

I'm not sure how to make this work, or what I'm doing wrong. I was expecting that the save() method would know about $this->location, but maybe I'm misunderstanding something. Can't seem to find anything different in the docs from what I'm doing. I've also looked through other questions with the same error and not finding an answer.

I can move the Log statement to the mount method or the render method and it will log the correct info. I don't understand why it's not available to the save() method.

Here's my livewire component:

class LocationInfo extends Component
{

    public Object $states;
    public Location $location;

    protected $rules = [
        'location.name'          => ['required', 'string', 'max:150'],
        ...
    ];

    public function mount(Location $location)
    {
        $this->location = $location;
        $this->states = USState::all();
    }


    public function render()
    {
        return view('livewire.location-info');
    }

    public function save()
    {
        Log::debug($this->location);
    }
}

and here's my form:

<div  id="location_info_modal" tabindex="-1" aria-labelledby="location_info_modal" aria-hidden="true">
    <div >
        <form wire:submit.prevent="save"  id="location_info_form" method="POST" action="/locations/{{ $location->id }}">
            <div >
                <div >
                    <div id="modal_header" >
                        <h5 >Edit Location Info</h5>
                    </div>
                    <button type="button"  data-bs-dismiss="modal"
                        aria-label="btn-close"></button>
                </div>
                <div >
                    <div >
                        @csrf
                        <div >
                            <label for="name" >Location Name</label>
                            <input wire:model="location.name" type="text"  id="name" placeholder="name" name="name" value="{{ $location->name ?? '' }}" data-inputmask-regex="[A-Za-z0-9#.,''-() &] ">
                            @error('location.name') <span >{{ $message }}</span> @enderror
                        </div>
                    
                    </div>
                </div>
                <div >
                    <button type="button"  data-bs-dismiss="modal">Cancel</button>
                    <button type="submit"  id="location_info_save" disabled>Save</button>
                </div>
            </div>
        </form>
    </div>
</div>

and here's my route:

Route::post('/locations/{id}', [LocationInfo::class, 'save'])
    ->middleware('auth');

CodePudding user response：

I had this error before to me it was the typed property try to remove it like:

public $location;

public function mount(Location $location)
{
    $this->location = $location;
}

or remove the one in the mount:

public Location $location;

public function mount()
{
    $this->location = new Location();
}