हल: राउटर डोम एनपीएम पर प्रतिक्रिया करें

रिएक्ट राउटर डोम से जुड़ी मुख्य समस्या यह है कि इसे डिबग करना मुश्किल हो सकता है। क्योंकि रूटिंग को रिएक्ट राउटर द्वारा नियंत्रित किया जाता है, यह ठीक से इंगित करना कठिन हो सकता है कि कोई समस्या कहाँ हो रही है। इसके अतिरिक्त, चूंकि रिएक्ट राउटर डोम अपनी रूटिंग के लिए जावास्क्रिप्ट का उपयोग करता है, कोड में कोई भी त्रुटि अप्रत्याशित व्यवहार का कारण बन सकती है और डिबगिंग को और भी कठिन बना सकती है। अंत में, यदि किसी उपयोगकर्ता के पास रिएक्ट राउटर डोम का पुराना संस्करण स्थापित है, तो वे पुस्तकालय के नए संस्करणों के साथ संगतता समस्याओं का अनुभव कर सकते हैं।

import { BrowserRouter as Router, Route } from "react-router-dom";

<Router>
  <Route exact path="/" component={Home} />
  <Route path="/about" component={About} />
</Router>

1. "राउटर-राउटर-डोम 'से {ब्राउज़र राउटर को राउटर, रूट} के रूप में आयात करें;"
यह लाइन प्रतिक्रिया-राउटर-डोम लाइब्रेरी से ब्राउज़र राउटर और रूट घटकों को आयात करती है।

2. '"
यह लाइन एक राउटर घटक बनाती है जिसका उपयोग एप्लिकेशन में सभी मार्गों को लपेटने के लिए किया जाएगा।

3. '"
यह लाइन एक रूट कंपोनेंट बनाती है जो पाथ '/' होने पर होम कंपोनेंट को रेंडर करेगा। 'सटीक' प्रोप यह सुनिश्चित करता है कि यह मार्ग केवल तभी मेल खाएगा जब पथ बिल्कुल '/' हो।

4. '” यह लाइन एक रूट कंपोनेंट बनाती है जो पाथ '/about' होने पर अबाउट कंपोनेंट को रेंडर करेगा।

5. "" यह लाइन राउटर घटक को बंद कर देती है और रिएक्ट को संकेत देती है कि हमारे सभी मार्ग घोषित कर दिए गए हैं।

एनपीएम पैकेज मैनेजर

एनपीएम (नोड पैकेज मैनेजर) जावास्क्रिप्ट के लिए एक पैकेज मैनेजर है जो डेवलपर्स को उनके रिएक्ट एप्लिकेशन के लिए पैकेज को आसानी से इंस्टॉल, अपडेट और प्रबंधित करने में मदद करता है। यह रिएक्ट राउटर लाइब्रेरी के लिए डिफॉल्ट पैकेज मैनेजर है और रिएक्ट एप्लिकेशन में उपयोग किए जा सकने वाले पैकेजों की एक विस्तृत श्रृंखला तक पहुंच प्रदान करता है। एनपीएम डेवलपर्स को आधिकारिक रजिस्ट्री के साथ-साथ अन्य तृतीय-पक्ष स्रोतों से पैकेजों को जल्दी से खोजने और स्थापित करने की अनुमति देता है। यह विभिन्न पैकेजों के बीच निर्भरता को प्रबंधित करने के लिए उपकरण भी प्रदान करता है, जिससे यह ट्रैक करना आसान हो जाता है कि किसी एप्लिकेशन में प्रत्येक पैकेज के कौन से संस्करण स्थापित हैं। इसके अतिरिक्त, एनपीएम का उपयोग मौजूदा पैकेजों को आसानी से अपडेट करने के लिए किया जा सकता है या यदि उनकी आवश्यकता नहीं है तो उन्हें अनइंस्टॉल भी किया जा सकता है।

प्रतिक्रिया राउटर डोम क्या है

रिएक्ट राउटर डोम रिएक्ट के लिए एक रूटिंग लाइब्रेरी है जो डेवलपर्स को उनके रिएक्ट एप्लिकेशन के भीतर रूट बनाने और प्रबंधित करने की अनुमति देता है। यह घटकों के मार्गों को घोषित रूप से मैप करने, ब्राउज़र के इतिहास को प्रबंधित करने और UI को URL के साथ समन्वयित रखने का एक तरीका प्रदान करता है। इसमें डायनेमिक रूट मैचिंग, लोकेशन ट्रांज़िशन हैंडलिंग और URL जेनरेशन जैसी सुविधाएँ भी शामिल हैं।

डोम एनपीएम रिएक्ट राउटर कैसे स्थापित करें

1. रिएक्ट राउटर स्थापित करें:
सबसे पहले, एनपीएम या यार्न का उपयोग करके रिएक्ट राउटर पैकेज स्थापित करें।
उदाहरण के लिए, यदि आप एनपीएम का उपयोग कर रहे हैं:
एनपीएम प्रतिक्रिया-राउटर-डोम स्थापित करें

2. रिएक्ट राउटर आयात करें:
एक बार इंस्टॉलेशन पूरा हो जाने के बाद, आपको अपने एप्लिकेशन में प्रतिक्रिया-राउटर-डोम से घटकों को आयात करना होगा। उदाहरण के लिए:
'प्रतिक्रिया-राउटर-डोम' से {ब्राउज़र राउटर को राउटर, रूट} के रूप में आयात करें;

3. राउटर घटक में अपना ऐप लपेटें:
अगला कदम अपने रूट घटक को एक के साथ लपेटना है प्रतिक्रिया-राउटर-डोम से घटक। यह आपके एप्लिकेशन को रूटिंग क्षमताओं के साथ प्रदान करेगा और उपयोगकर्ता द्वारा देखे जा रहे वर्तमान URL पथ से अवगत कराएगा। उदाहरण के लिए:

कॉन्स्ट ऐप = () => (
 
 

    );

4. अपने ऐप में रूट जोड़ें: अंतिम चरण का उपयोग करके अपने एप्लिकेशन में रूट जोड़ना है प्रतिक्रिया राउटर डोम द्वारा प्रदान किया गया घटक। मार्ग घटक दो सहारा लेता है; पथ और घटक जो आपको यह निर्दिष्ट करने की अनुमति देता है कि जब कोई उपयोगकर्ता आपके एप्लिकेशन में किसी निश्चित URL पथ पर जाता है तो कौन से घटक प्रस्तुत किए जाने चाहिए उदाहरण के लिए:

कॉन्स्ट ऐप = () => (
 
 

   )