हल: प्रतिक्रिया राउटर पुनः लोड पृष्ठ नहीं मिला

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

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

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

      {/* Page Not Found */}
      <Route render={() => (<h1>Page not found</h1>)} />

    </Switch>
  </Router>  
);

// लाइन 1: यह लाइन प्रतिक्रिया-राउटर-डोम लाइब्रेरी से ब्राउज़र राउटर, रूट और स्विच घटकों को आयात करती है।

// लाइन 3: यह लाइन ऐप नामक एक फ़ंक्शन को परिभाषित करती है जो JSX कोड लौटाती है।

// लाइन 5: यह लाइन प्रतिक्रिया-राउटर-डोम से राउटर घटक में पूरे JSX कोड को लपेटती है।

// लाइन 6: यह लाइन प्रतिक्रिया-राउटर-डोम से एक स्विच घटक में सभी मार्गों को लपेटती है।

// लाइन्स 7 - 9: ये लाइनें क्रमशः '/' और '/ के बारे में' के लिए अपने संबंधित घटकों (होम और अबाउट) के साथ दो मार्गों को परिभाषित करती हैं।

// लाइन्स 11 - 12: ये लाइनें उस रूट को परिभाषित करती हैं जब कोई अन्य रूट मैच नहीं करता है, जो "पेज नहीं मिला" कहते हुए एक एच 1 टैग प्रस्तुत करता है।

पृष्ठ नहीं मिला त्रुटि

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

मैं प्रतिक्रिया राउटर में पेज नहीं मिला कैसे संभाल सकता हूं

रिएक्ट राउटर का उपयोग करते समय, आप एक कस्टम रूट बनाकर एक पृष्ठ को संभाल सकते हैं जो URL के किसी भी मौजूदा रूट से मेल नहीं खाने पर NotFound घटक को प्रस्तुत करेगा। ऐसा करने के लिए, आपको "*" पर सेट पथ के साथ एक नया मार्ग बनाना होगा और अपने NotFound घटक को रेंडर करना होगा।

उदाहरण के लिए:

} />

यह किसी भी ऐसे URL से मेल खाएगा जो पहले से किसी मौजूदा रूट से मेल नहीं खाता है और आपके NotFound घटक को प्रस्तुत करेगा।

मैं एक प्रतिक्रिया पृष्ठ को पुनः लोड करने के लिए कैसे बाध्य करूं

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

const AppRouter = () => (

{/* आपके रास्ते यहां हैं */}

);

एक बार आपके पास इतिहास वस्तु तक पहुंच हो जाने के बाद, आप इसकी प्रतिस्थापन विधि का उपयोग इस प्रकार कर सकते हैं:

इतिहास.प्रतिस्थापन ('/ कुछ-मार्ग');