laravel-livewire - 複数の入力Laravel Livewireで適切な値を更新して表示するにはどうすればよいですか

Question

フルページの livewire コンポーネントがあり、1 つのモーダルで crud を実行しています。製品のバリエーションを作成していますが、バリエーションには複数の値があるため、その場合は と の間に 1 対多の関係を作成しましVariationたVariationValue。作成時には問題はありませんが、更新したいときに問題があり、複数の入力のindex値が入力内に正しく表示されません。そのようにすると、$value->value入力内に適切な値が表示されますが、更新または更新できませんがなくなるまでそれらを削除しますid。

ユーザーが必要に応じてフィールドを更新および削除したり、追加したりできるようにしたいのですが、入力内に適切な値を表示できず、削除するものを取得できないという問題がありidます。機能しません。要素を検査すると、内部の値が表示されるだけです。新しい値の更新と削除のためにこれを行うにはどうすればよいですか。たくさん検索しましたが、結果が見つかりませんでした。画像の下に、これらの入力の中に適切な値が表示されていないことがわかります。db$editModewire:model.defer="{{ $editMode ? $values[$key]->value : 'values.'.$key }}"wire:model.defer="value"[object Object]

$editMode = trueそれが私にこのように見せているとき

私のモーダルブレードで

<div class="col-12">
   <fieldset>
     <label>Variation values *</label>
     @foreach ($moreValues as $key => $value)
        <div class="{{ $loop->last ? '' : 'mb-2' }}" wire:key="{{ $key }}">

          <div class="input-group">
            <input type="text" 
                   wire:model.defer="values.{{ $key }}" 
                   class="form-control"                                       
                   placeholder="Variation value">

            <div class="input-group-append">
             @if ($loop->index === 0)
               <button wire:click.prevent="addRowForValue" 
                       class="btn btn-primary font-size-large" type="button">
                    +
               </button>
             @else
               <button wire:click.prevent="removeRowForValue({{ $key }})"
                       class="btn btn-danger font-size-large" type="button">
                    -
               </button>
             @endif
           </div>
         </div>

        @error("values.{{ $key }}")
           <span class="text-danger font-size-base">{{ $message }}</span>
        @enderror
      </div>
    @endforeach
  </fieldset>
</div>

私のコンポーネントで

<?php

namespace App\Http\Livewire\Products\Variations;

use App\Models\Variation;
use Livewire\Component;

class Index extends Component
{

    public $moreValues = [0];

    public $editMode = false;

    public $name, $values = [];

    protected $rules = [
        'name' => 'required|string',
        'values.*' => 'required|string',
    ];

    public function addRowForValue()
    {
        $this->moreValues[] += 1;
    }

    public function removeRowForValue($key)
    {
        unset($this->moreValues[$key]);
    }

    public function store()
    {
        $this->validate();

        $variation = Variation::create([
            'name' => $this->name
        ]);

        foreach ($this->values as $key => $value) {
            $variation->values()->create([
                'value' => $this->values[$key]
            ]);
        }

        session()->flash('message', 'Unit create successfully.');

        $this->clearForm();
    }

    /**
     * @param $id
     */
    public function edit($id)
    {
        $this->editMode = true;

        $this->moreValues = [0];

        $this->resetErrorBag();

        $this->clearForm();

        // fill the form here with data
        $variation = Variation::query()->findOrFail($id);

        $this->name = $variation->name;

        $this->values = [];

        foreach ($variation->values as $key => $value) {

            // incrementing input by value
            $this->moreValues[$key] = $value;

            // showing value their own field
            $this->values[$key] = $value;
        }

        $this->emit('openModal');
    }

    protected function clearForm()
    {
        $this->name = '';
        $this->values = '';
    }

    public function render()
    {
        $variations = Variation::with('values')->latest('id')->get();

        return view('livewire.products.variations.index', compact('variations'))
            ->extends('layouts.app');
    }
}