为什么在刀片文件中输出用户通知时出现错误？

Question

在 Laravel 10 livewire 3 中，我显示了用户通知列表：

namespace App\Livewire\Personal;

use Livewire\WithPagination;

class ProfileEditor extends Component
{
    use WithPagination;
    public $notifications;
    public int $notificationsPage= 1;
    public bool $notificationsOnlyUnread= true;


    public function render(): View
    {
        $this->notifications =  auth()->user()->notifications()->latest()->paginate(2);

        return view('livewire.personal.profile-editor')->layout('components.layouts.personal');
    }

但是在 Blade 中我遇到了错误：

Property type not supported in Livewire for property: [{"current_page":1,"data":[{"id":"f4bec30e-e661-4f91-aafd-a9ae623cf269","type":"App\\Notifications
...

有模板线

<table class="editor_listing_table mb-4">
    <thead class="editor_listing_table_header">
    <tr>
        <td>
            <h3 class="personal_subtitle">
                Your Notifications
            </h3>
        </td>
    </tr>
    </thead>
    @foreach($notifications as $notification)
    {{--                            {{ dd($notification)--}}
    <tr>
        <td class="editor_listing_cell whitespace-nowrap">
            {{$notification->notifiable_id}}
        </td>
        <td class="editor_listing_cell whitespace-nowrap">
            {{$notification->notifiable_type}}
        </td>

    </tr>
    @endforeach
</table>

@if(count($notifications) > 0)
<div class="livewire-pagination">
    {{ $notifications->onEachSide(2)->links(data: ['scrollTo' => false]) }}
</div>
@endif

如果取消注释行

dd($notification)

我明白了：

对于任何行项目都具有 DatabaseNotification 类。

如果在 dd 中使用 toArray 方法，我会看到有效的数据行，但无论如何这是

Property type not supported ...

错误，我不知道如何修复它？实际上我没有在我的刀片文件中引用“类型”字段

Answer 1

您不需要将其作为实时属性，因此您可以将其作为变量传递给视图。

首先，删除属性

public $notifications;

然后更新您的渲染方法，通过

view()

数据参数传递它。

public function render(): View { 
    $notifications = auth()->user()->notifications()->latest()->paginate(2); 

    return view('livewire.personal.profile-editor', [
            'notifications' => $notifications,
        ])
        ->layout('components.layouts.personal'); 
}