Selesai: menavigasi penghala tindak balas 6

Masalah utama yang berkaitan dengan React Router 6 navigate ialah ia tidak menyediakan cara untuk menghantar prop atau keadaan ke laluan sasaran. Ini bermakna jika anda perlu menghantar data dari satu laluan ke laluan yang lain, anda mesti menggunakan perpustakaan seperti React Query atau Redux. Selain itu, sistem navigasi adalah berdasarkan URL dan bukan komponen, jadi sukar bagi pembangun yang biasa bekerja dengan komponen dan bukannya URL.

import { useHistory } from "react-router-dom";

const history = useHistory();

history.navigate("/path/to/page");

1. Baris ini mengimport cangkuk useHistory daripada perpustakaan react-router-dom.
2. Baris ini mencipta pemalar baharu yang dipanggil sejarah dan memberikannya kepada cangkuk useHistory.
3. Baris ini menggunakan pemalar sejarah untuk menavigasi ke laluan yang ditentukan, dalam kes ini "/path/to/page".

Navigate

React Router ialah perpustakaan penghalaan yang berkuasa yang dibina di atas React yang membantu pembangun mencipta, mengurus dan mengendalikan navigasi dalam aplikasi mereka. Ia menyediakan penyelesaian penghalaan lengkap untuk aplikasi React dengan ciri seperti padanan laluan dinamik, pengendalian peralihan lokasi, pemulihan tatal dan banyak lagi. Navigate ialah bahagian penting Penghala React yang membolehkan pembangun menavigasi secara pemrograman antara laluan berbeza dalam aplikasi mereka. Ia menyediakan API untuk menavigasi antara laluan menggunakan objek sejarah atau dengan menyediakan nama laluan secara langsung. Dengan Navigate, pembangun boleh membuat pautan ke halaman lain dengan mudah dalam aplikasi mereka dan memberikan pengguna keupayaan untuk bertukar antara paparan berbeza tanpa memuatkan semula halaman.

Bagaimanakah cara saya menavigasi dengan penghala tindak balas?

Menavigasi dengan React Router adalah proses yang mudah. Untuk bermula, anda perlu memasang pakej React Router daripada npm. Setelah dipasang, anda boleh menggunakan komponen untuk menentukan laluan dalam aplikasi anda. The komponen mengambil dua prop: laluan dan komponen. Prop laluan mentakrifkan laluan URL yang akan mencetuskan laluan dan prop komponen ialah komponen React yang akan dipaparkan apabila laluan itu dipadankan.

Anda juga boleh menggunakan komponen lain seperti , , dan untuk menyesuaikan lagi pengalaman penghalaan anda. The komponen membolehkan anda membuat pautan antara laluan yang berbeza dalam aplikasi anda, manakala komponen membolehkan anda mengubah hala pengguna dari satu laluan ke laluan yang lain. Akhirnya, yang komponen membenarkan anda untuk memaparkan hanya satu daripada berbilang komponen berdasarkan laluan yang sepadan dahulu.

Menggunakan komponen ini bersama-sama memberi anda kawalan yang berkuasa ke atas cara pengguna menavigasi aplikasi anda dan menyediakan cara intuitif untuk mereka berbuat demikian.