Isu penomboran Livewire dengan berbilang komponen pada halaman yang sama
P粉714780768
2023-09-01 12:49:12
<p>Saya menghadapi masalah dengan penomboran Livewire apabila menggunakan dua komponen penomboran pada halaman yang sama. Saya mengikuti nasihat dokumentasi Livewire tentang menggunakan berbilang penomboran. Walau bagaimanapun, apabila saya cuba menavigasi ke halaman pada salah satu komponen, saya menghadapi dua masalah: </p>
<ul>
<li>Kali pertama saya menavigasi ia berfungsi seperti yang diharapkan, tetapi percubaan berikutnya tidak mengubah hala;</li>
<li>Pautan ke navigasi bernombor hilang selepas ubah hala pertama;</li>
<li>Jika saya menukar URL secara manual, komponen itu mencerminkan perubahan dan memaparkan halaman yang betul. Walaupun mengklik halaman pada komponen itu sendiri hanya berfungsi pada kali pertama. </li>
</ul>
<p>Komponen lain berfungsi seperti yang diharapkan dan dicipta dengan cara yang sama seperti komponen yang menunjukkan masalah yang diterangkan. </p>
<p>Saya cuba mengikuti dokumentasi dan penyahpepijatan, tetapi tidak kesampaian. Berikut ialah versi ringkas kod saya, secara longgar berdasarkan dokumentasi. </p>
<p><strong>ActivityLogs.php</strong></p>
<pre class="brush:php;toolbar:false;">class ActivityLogs memanjangkan Komponen
{
gunakan WithPagination;
Model awam $model;
Peribadi ActivityLogRepository $activityLogRepository;
but fungsi awam(ActivityLogRepository $activityLogRepository): batal
{
$this->activityLogRepository = $activityLogRepository;
}
pelekap fungsi awam(Model $model): batal
{
$this->model = $model;
}
fungsi awam render(): Lihat
{
paparan kembali('livewire.activity-logs.activity-logs', [
'aktiviti' => $this->activityLogRepository
->getLogsForModel($this->model)
->halaman(5, pageName: 'activityPage'),
]);
}
}</pre>
<p><strong>activity-logs.blade.php</strong></p>
<pre class="brush:php;toolbar:false;"><x-cards.simple class="col-span-6 lg:col-span-3 xl:col-span-2 overscroll-contain" ;
max-height="lg"
title="{{ __('Log Aktiviti') }}"
icon="projek"
>
<div class="my-2 pr-2 h-penuh lg:max-h-[300px]">
@if($activities->isNotEmpty())
@foreach($aktiviti sebagai $aktiviti)
@dump($aktiviti)
@endforeach
<div class="mt-8">
{{ $aktiviti->onEachSide(1)->pautan() }}
</div>
@lain
<span>
{{ __('Model ini tidak mempunyai aktiviti log.') }}
</span>
@endif
</div>
</x-cards.simple></pre>
<p>Saya akan berterima kasih jika anda dapat memahami mengapa saya menghadapi masalah di atas. Terima kasih! </p>
Komponen bersarang anda nampaknya kehilangan atribut
:key
属性。由于 Livewire 需要知道应重新渲染哪个组件,因此使用:key
untuk menjejak komponen.Dikemas kini activity-logs.blade.php
Rujukan: https://laravel-livewire.com /docs/2.x/nesting-components#keyed-components