如何在 Eloquent 模型中使用 Laravel Livewire？答案

【问题标题】：How to use Laravel Livewire with Eloquent Models?如何在 Eloquent 模型中使用 Laravel Livewire？
【发布时间】：2020-10-17 15:53:15
【问题描述】：

我正在第一次尝试 Laravel Livewire 与一个项目。我正在尝试使用一组级联下拉列表构建一个相当简单的表单 - 一个输入依赖于另一个。但是，当我尝试将 eloquent 对象传递给组件属性时，它会被转换为字符串，因此我无法访问该对象的任何属性。

我觉得我可能缺少一些非常简单的东西。

这是我的组件代码：

PostComponent.php

class PostComponent extends Component
{
    public $manufacturers;
    public $manufacturer = 'Select a Manufacturer';
    public $cars;

    public function mount()
    {
        $this->manufacturers = Manufacturer::orderBy('name')->get(); 
    }
    
    public function updated()
    {
        $this->cars = Car::where('manufacturer_id', $this->manufacturer->id)->get();
    }

    public function render()
    {
        return view('livewire.post-component');
    }

这是我的刀片文件：

<label for="manufacturer">Manufacturer</label>
<select wire:model="manufacturer" id="manufacturer">
    <option selected="selected" disabled>Select a Manufacturer</option>
        @foreach($manufacturers as $selectableManufacturer)
            <option value="{{ $selectableManufacturer }}">{{ $selectableManufacturer->name }}</option>
        @endforeach
</select>

当我尝试在下拉列表中选择制造商时，我可以记录 $manufacturer 并看到该值为

{"id":16,"name":"Manufacturer1","description":"lorem ipsum","created_at":"2020-06-26T23:44:37.000000Z","updated_at":"2020-06-26T23:44:37.000000Z"}

但是当我尝试在 updated 生命周期挂钩中选择汽车时尝试获取制造商的 id 时，我得到了错误

试图获取非对象的属性“id”

知道为什么会发生这种情况以及如何解决它吗？

【问题讨论】：

标签： php laravel laravel-blade laravel-livewire

【解决方案1】：

您的实现的问题是，在选择框中，您在刀片中回显的是string，而不是object，因此线模态将通过获取输入事件的值来完成其工作将其与后端同步。有两种方法可以实现您的目标。

将select选项的值作为制造商id，然后可以直接在更新的生命周期钩子中使用。

 <label for="manufacturer_id">Manufacturer</label>
    <select wire:model="manufacturer_id" id="manufacturer_id">
        <option selected="selected" disabled>Select a Manufacturer</option>
        @foreach($manufacturers as $selectableManufacturer)
        <option value="{{ $selectableManufacturer->id }}">{{ $selectableManufacturer->name }}</option>
        @endforeach
    </select>

在更新的钩子中，

 
 public $manufacturer_id; 
 public function updated() 
    {
        $this->cars = Car::where('manufacturer_id', $this->manufacturer_id)->get();
    }

或者只是使用json_decode() 函数将其变成一个对象，然后像您所做的那样访问 id 属性。

 public function updated()
    {
        $manufacturer = json_decode($this->manufacturer);
        $this->cars = Car::where('manufacturer_id', $manufacturer->id)->get();
    }

但健康的方法是使用 id 作为值。

【讨论】：

【解决方案2】：

您应该同步所选制造商的id 并在更新的挂钩中使用它。这是你可以做到的。

class PostComponent extends Component
{
    public $manufacturers;
    public $manufacturer_id;
    public $manufacturer = 'Select a Manufacturer';
    public $cars;

    public function mount()
    {
        $this->manufacturers = Manufacturer::orderBy('name')->get(); 
    }
    
    public function updatedManufacturerId()
    {
        $this->cars = Car::where('manufacturer_id', $this->manufacturer_id)->get();
    }

    public function render()
    {
        return view('livewire.post-component');
    }
}

前端可以保持不变。

    <label for="manufacturer_id">Manufacturer</label>
    <select wire:model="manufacturer_id" id="manufacturer_id">
        <option selected="selected" disabled>Select a Manufacturer</option>
        @foreach($manufacturers as $selectableManufacturer)
        <option value="{{ $selectableManufacturer->id }}">{{ $selectableManufacturer->name }}</option>
        @endforeach
    </select>

【讨论】：

【解决方案3】：

只需按照文档操作即可：

https://laravel-livewire.com/docs/2.x/properties#binding-models

【讨论】：