Bagaimana untuk Menghantar Props Tersuai kepada Komponen Penghala dalam React-Router v4?

Melalukan Props Tersuai kepada Komponen Penghala dalam React-Router v4

Apabila bekerja dengan aplikasi React berbilang halaman menggunakan React-Router, lulus tersuai prop ke halaman individu boleh meningkatkan fleksibiliti kod anda. Ini membolehkan kefungsian yang disesuaikan dan perkongsian data merentas komponen.

Walau bagaimanapun, anda telah menghadapi isu di mana objek this.props.route, yang biasanya digunakan untuk mengakses prop yang diluluskan melalui laluan, kembali tidak ditentukan. Untuk menyelesaikan masalah ini, pertimbangkan untuk menggunakan prop render dalam komponen Route anda, mengikut dokumentasi React-Router:

<Route path="/" exact render={(props) => (<Home test="hi" {...props}/>)} />

Dalam pendekatan ini, fungsi prop render menerima semua prop yang sama seperti prop komponen, termasuk tersuai alat peraga seperti ujian. Untuk mengakses prop dalam komponen Laman Utama anda, gunakan this.props.test.

Selain itu, pastikan anda melepasi {...props} dalam fungsi prop render, kerana ini memastikan prop penghala lalai seperti lokasi , sejarah dan padanan juga diserahkan kepada komponen anda.

Atas ialah kandungan terperinci Bagaimana untuk Menghantar Props Tersuai kepada Komponen Penghala dalam React-Router v4?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!