हल: प्रतिक्रिया राउटर सभी को पकड़ने के लिए फ़ॉलबैक जोड़ें

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

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

const App = () => (
  <Router>
    <Switch>
      <Route exact path="/" component={Home} />
      <Route path="/about" component={About} />

      {/* Fallback route */}
      <Route component={NoMatch} /> 

    </Switch>
  </Router>  
);

// लाइन 1: यह लाइन प्रतिक्रिया-राउटर-डोम लाइब्रेरी से ब्राउज़र राउटर, रूट और स्विच घटकों को आयात करती है।
// पंक्ति 2: यह रेखा एक स्थिरांक को परिभाषित करती है जिसे ऐप कहा जाता है जो एक फ़ंक्शन घटक है।
// रेखा 3: यह रेखा राउटर घटक को प्रतिक्रिया-राउटर-डोम से प्रस्तुत करती है।
// रेखा 4: यह रेखा प्रतिक्रिया-राउटर-डोम से स्विच घटक का प्रतिपादन करती है।
// लाइन्स 5 और 6: ये लाइनें दो रूट घटकों को सटीक पथों और घटकों के साथ प्रस्तुत करती हैं, जब उन रास्तों का मिलान किया जाता है।
// लाइन 8: यदि अन्य मार्गों में से कोई भी मेल नहीं खाता है तो यह लाइन एक फ़ॉलबैक मार्ग प्रदान करती है। यदि कोई अन्य मार्ग मेल नहीं खाता है तो यह NoMatch घटक प्रस्तुत करेगा।

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

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

कैच-ऑल फ़ॉलबैक मार्ग

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

फ़ॉलबैक रूट को ठीक से कैसे परिभाषित करें

रिएक्ट राउटर का उपयोग करते समय, फ़ॉलबैक रूट एक ऐसा रूट होता है जिसका उपयोग तब किया जाता है जब कोई अन्य रूट अनुरोधित URL से मेल नहीं खाता हो। अनुरोधित यूआरएल मौजूद नहीं होने पर आमतौर पर उपयोगकर्ताओं को 404 पेज या किसी अन्य पेज पर रीडायरेक्ट करने के लिए उपयोग किया जाता है।

रिएक्ट राउटर में फ़ॉलबैक रूट को ठीक से परिभाषित करने के लिए, आपको पहले एक बनाना चाहिए घटक और इसे अपने मार्गों के चारों ओर लपेटें। के अंदर घटक, आपको अपने सामान्य मार्गों को एक के बाद शामिल करना चाहिए घटक जिसमें कोई पथ निर्दिष्ट नहीं है। यह आपका फ़ॉलबैक मार्ग होगा और ऐसे किसी भी अनुरोध को पकड़ेगा जो आपके किसी अन्य मार्ग से मेल नहीं खाता है। फिर आप निर्दिष्ट कर सकते हैं कि इस मार्ग के मिलान होने पर क्या होना चाहिए, जैसे कि 404 पृष्ठ पर पुनर्निर्देशित करना या कुछ अन्य सामग्री प्रदर्शित करना।

फ़ॉलबैक रूट हमेशा ट्रिगर क्यों होता है

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