php - 模型的属性如何在 Livewire Laravel 中默认为原始属性

Question

我最初在 livewire 组件的 mount() 方法中有 ma DB eloquent 调用，但后来我觉得它实际上并没有被调用一次，因为我的属性被重写了，所以我移动了它们到 Laravel 的 Controller 。

现在在 Laravel Controller 中

public function photos() {
    $photos = Image::all();

    foreach ($photos as $photo) {
        $photo->imgLqPath = Storage::disk('s3')->temporaryUrl($photo->path025, now()->addHour());
        $photo->imgPath = Storage::disk('s3')->temporaryUrl($photo->path, now()->addHour());
    }

    return view('cs.photos', [
        'photos' => $photos
    ]);
}

然后将这些照片传递给组件@livewire('cs.photos', ['photos' => $photos])

现在在组件的 View 中，我循环查看它们发生了什么

@foreach ($photos as $ph)
    <pre>{{ json_encode($ph->getAttributes(), JSON_PRETTY_PRINT|JSON_UNESCAPED_UNICODE) }}</pre>
@endforeach

导致

{
    "id": 204,
    "name": "long_name.png",
    "path": "long_path.png",
    "description": null,
    "path025": "long_path.png",
    "user_id": 5,
    "coord_id": null,
    "gpsx": 12.3,
    "gpsy": 45.56,
    "imageable_type": "App\\CS",
    "imageable_id": 193,
    "created_at": "2021-07-24 14:02:30",
    "updated_at": "2021-07-24 14:02:30",
    "imgLqPath": "https:\/\/path...",
    "imgPath": "https:\/\/path..."
}

有了这个我很高兴，但是，每当我通过 wire:click 调用任何操作时(我也尝试了 .stop 和 .prevent .

<img
    class="card-img-top"
    src="{{ $photo->imgLqPath }}"
    alt="..."
    height="200px"
    style="object-fit: contain;"
    wire:click="selectPhoto({{ $photo }})"
>

(不管 Action 是否做某事，即使函数体为空白也会出现问题)

public function selectPhoto(Image $photo)
{
    // $this->photo = $photo;
    // $this->emit('photoSelected', 'test');
}

我的照片属性循环更改为

{
    "id": 204,
    "name": "long_name.png",
    "path": "long_path.png",
    "description": null,
    "path025": "long_path.png",
    "user_id": 5,
    "coord_id": null,
    "gpsx": 12.3,
    "gpsy": 45.56,
    "imageable_type": "App\\CS",
    "imageable_id": 193,
    "created_at": "2021-07-24 14:02:30",
    "updated_at": "2021-07-24 14:02:30"
}

似乎他们的属性被重置为原始属性，但我不知道为什么会发生这种情况。

更新:

我在 livewire 组件 Controller 中添加了:

public function hydratePhotos($value) {
    dd($value);
}

它转储了一组没有 path 属性的照片，所以这似乎是问题所在。我还不确定如何解决它，所以如果在我解决之前没有答案，我会再次更新。

Answer 1

与人们可能“感觉”到的不同，Livewire 请求是有状态的 - 这意味着任何数据都在请求之间来回发送 - 一些数据是从每个请求的数据库。对于模型和模型集合，在每次请求之间从数据库中查询它们 - 只有模型类和 key 存储在请求中。

这意味着当您的组件在后续请求中重新水合时，您必须重新应用这些自定义属性。如果我们假设您在 Livewire 组件的属性 $photos 中有一个集合，您可以这样做

public function hydrate()
{
    foreach ($this->photos as $photo) {
        $photo->imgLqPath = Storage::disk('s3')->temporaryUrl($photo->path025, now()->addHour());
        $photo->imgPath = Storage::disk('s3')->temporaryUrl($photo->path, now()->addHour());
    }
}