Livewire: Data binding issue.

Blade:

			@if (!empty($editable_student->monthly_fees))
                    <span
                        class="font-sm font-black text-sky-500 pb-1 border-b block">{{ __('Monthly Fees') }}</span>
                    @foreach ($editable_student->monthly_fees as $index => $item)
                        <div class="border px-3 border-black relative mt-3 pb-3 pt-5">
                            <span class="absolute top-[-12px] left-2 bg-white text-black"
                                style="top: -12px;padding: 0 14px;border: 1px solid #000;">
                                {{ $item->pivot->month }}
                            </span>
                            <x-input type="hidden" wire:model="monthly_fees.{{ $index }}.id"
                                value={{ $item->id }} />

                            <x-input class="" label="Name" placeholder="Enter amount"
                                corner-hint="Ex: 250"
                                wire:model.defer="monthly_fees.{{ $index }}.amount" />

                            <x-select label="Select Status" placeholder="Select status" :options="['Paid', 'Unpaid']"
                                wire:model.defer="monthly_fees.{{ $index }}.status" />
                        </div>
                    @endforeach
                @endif

Component: public $monthly_fees = [];

dd shows on submit:

array:2 [▼ 0 => array:2 [▼ "amount" => "345" "id" => "345" ] 1 => array:2 [▼ "amount" => "8765" "id" => "8765" ] ]

Here I'm getting the same value in id as I fill amount value. I've got this problem in my another component.