Bagaimana untuk menghantar data dengan berkesan antara halaman menggunakan penghala tindak balas?

Cara Menghantar Data dari Halaman ke Halaman Lain Menggunakan React Router

Apabila bekerja dengan React Router, anda mungkin menghadapi situasi yang anda perlukan untuk menghantar data dari satu halaman ke halaman yang lain, seperti memaparkan butiran pengguna pada skrin yang berbeza. Berikut ialah beberapa pilihan untuk menghantar data:

Pilihan 1: Lulus Keadaan Laluan

• Gunakan komponen Pautan dalam React Router DOM v6, atau komponen Navigate dalam v5, dan tetapkan prop keadaan.
• Buka bungkusan keadaan daripada objek lokasi pada penerima halaman.
• Kelebihan: Keadaan tidak kelihatan dalam URL dan memastikan UI sentiasa bersih.

Pilihan 2: Lulus Sesuatu dalam Laluan URL

• Tambahkan data pada laluan URL menggunakan komponen Pautan atau pengaturcaraan navigasi.
• Akses parameter daripada objek props.match pada halaman penerimaan.
• Kelebihan: Data disimpan dalam URL dan boleh dikongsi dengan mudah.

Pilihan 3: Lulus Sesuatu dalam Pertanyaan URL Rentetan

• Gunakan prop carian pada komponen Pautan atau navigasi program untuk menghantar data sebagai parameter pertanyaan.
• Gunakan cangkuk useSearchParams (v6) atau objek URLSearchParams (v5 ) untuk menghuraikan parameter pertanyaan pada halaman penerima.
• Kelebihan: Boleh lulus kecil dengan mudah jumlah data.

Pertimbangan untuk Komponen Kelas React

• React Router DOM versi 6 telah mengalih keluar prop laluan dan withRouter HOC.
• Untuk mengakses prop laluan dalam komponen kelas, gunakan HOC denganRouter tersuai yang menggabungkan yang diperlukan cangkuk.

Atas ialah kandungan terperinci Bagaimana untuk menghantar data dengan berkesan antara halaman menggunakan penghala tindak balas?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!