出现错误“在初始化之前不能访问类型属性” - Laravel Livewire

Question

说明

我正在键入提示模型属性并尝试删除邀请数据。下面是它把我扔回去的错误。请帮帮我，因为我无法发现我错过了什么。

类型属性 App\Http\Livewire\Backend\UserManagement\FormComponent\InvitationManagementModal::$invitation 在初始化之前不得访问

精简、可复制粘贴的代码 sn-ps

• Livewire\InvitationManagementModal.php

<?php

namespace App\Http\Livewire\Backend\UserManagement\FormComponent;

use Livewire\Component;

use Livewire\WithPagination;
use App\Http\Livewire\Backend\DataTable\WithCachedRows;

use App\Models\Invitation;

class InvitationManagementModal extends Component
{
    use WithPagination, WithCachedRows;
    
    public $showInvitationManagementModal = false;
    public Invitation $invitation;

    protected $listeners = ['manageInvitation'];

    public function manageInvitation()
    {
        $this->showInvitationManagementModal = true;
    }

    public function deleteInvitation(Invitation $invitation)
    {
        $this->invitation->delete();
    }

    public function getInvitationRowsProperty()
    {
        return $this->cache(function () {
            $invitations = Invitation::where('registered_at', null)->paginate(5);
            return $invitations;
        });
    }

    public function render()
    {
        return view('livewire.backend.user-management.form-component.invitation-management-modal', ['invitations' => $this->invitationRows]);
    }
}

• livewire\invitation-management-modal.blade.php

<div>
    <x-modal.stacked wire:model.defer="showInvitationManagementModal" id="scroll-lock">
        <x-slot name="title">Manage Invitation</x-slot>
        <x-slot name="description">Manage all the invitations which are yet to be accepted.</x-slot>
        <x-slot name="content">
            <div class="p-8 space-y-4">
                <ul class="flex flex-col divide divide-y w-full bg-white rounded-lg shadow">
                    @forelse($invitations as $key => $invitation)
                        <li class="flex flex-row">
                            <div class="flex flex-1 items-center px-8 py-4">
                                <div class="flex-1 mr-16">
                                    <div class="text-sm dark:text-white">
                                        {{ $invitation->email }}
                                    </div>
                                </div>
                                <button wire:click="deleteInvitation" class="text-right flex justify-end">
                                    <x-icon.trash />
                                </button>
                            </div>
                        </li>
                    @empty
                    @endforelse
                </ul>
                <div>
                    {{ $invitations->links() }}
                </div>
            </div>
        </x-slot>
        <x-slot name="footer">
            <x-button.secondary wire:click.defer="$set('showInvitationManagementModal', false)">Cancel</x-button.secondary>
        </x-slot>
    </x-modal.stacked>
</div>

上下文

• Livewire 版本：2.3.5
• Laravel 版本：8.20.1
• 高山版本：2.8.0
• 浏览器：Chrome

Answer 1

试试这个：

public function deleteInvitation(Invitation $invitation)
{
    $this->invitation = $invitation;
    $this->invitation->delete();
} 

Answer 2

这里的其他答案都有一些小问题需要注意。您不必检查 $invitation，因为类型提示 Invitation 使 Laravel 使用 Model-Route-Binding，它会获取相应的记录 - 或者如果找不到则抛出 HTTP 404 状态代码。

其次，这是您当前看到的实际错误，您不必对$this->invitation 执行任何操作，因为它没有设置。您应该改为将参数传递给该方法。

在 Livewire 中循环数据时，始终建议使用wire:key，以便 Livewire 可以跟踪循环中的每条记录。

所以对于实际的删除方法，只需在输入变量上调用删除方法即可。

public function deleteInvitation(Invitation $invitation)
{
    $invitation->delete();
    // Emit an event to notify the user that the record was deleted
    // Refresh the parent component to remove the invitation from the list

}

对于您的刀片，将 wire:key 添加到循环中的第一个元素并将 ID 传递给方法。
（所以wire:click="deleteInvitation({{ $invitation->id }})" 而不是wire:click="deleteInvitation"）。

@forelse($invitations as $key => $invitation)
    <li class="flex flex-row" wire:key="invitation_{{ $invitation->id }}">
        <div class="flex flex-1 items-center px-8 py-4">
            <div class="flex-1 mr-16">
                <div class="text-sm dark:text-white">
                    {{ $invitation->email }}
                </div>
            </div>
            <button wire:click="deleteInvitation({{ $invitation->id }})" class="text-right flex justify-end">
                <x-icon.trash />
            </button>
        </div>
    </li>
@empty
@endforelse

这反过来意味着，由于它从未使用过，您可以删除该类的 $invitation 属性的声明，即 public $showInvitationManagementModal = false; 之后的行。

public Invitation $invitation;

Answer 3

试试这个：

public function deleteInvitation(Invitation $invitation)
{
    if($invitation){
        $invitation->delete();
    }
}