रिएक्ट राउटर बाहरी लिंक से संबंधित मुख्य समस्या यह है कि वे विभिन्न पृष्ठों के बीच नेविगेट करते समय अप्रत्याशित व्यवहार कर सकते हैं। उदाहरण के लिए, यदि कोई उपयोगकर्ता रिएक्ट राउटर पृष्ठ पर किसी बाहरी लिंक पर क्लिक करता है, तो ब्राउज़र एप्लिकेशन के भीतर नए पृष्ठ पर जाने के बजाय वर्तमान पृष्ठ से दूर चला जाएगा। यह उन उपयोगकर्ताओं के लिए भ्रम और हताशा पैदा कर सकता है जो पृष्ठों के बीच सहज संक्रमण की उम्मीद कर रहे हैं। इसके अतिरिक्त, बाहरी लिंक भी SEO के साथ समस्याएँ पैदा कर सकते हैं क्योंकि खोज इंजन बाहरी स्रोतों से सामग्री को ठीक से अनुक्रमित करने में सक्षम नहीं हो सकते हैं।
import { Link } from "react-router-dom";
<Link to="https://www.example.com" target="_blank" rel="noopener noreferrer">External Link</Link>
1. यह लाइन रिएक्शन-राउटर-डोम लाइब्रेरी से लिंक कंपोनेंट इम्पोर्ट करती है।
2. यह लाइन एक लिंक तत्व बनाती है जिसे क्लिक करने पर "https://www.example.com" पर रीडायरेक्ट किया जाएगा, और इसे एक नए टैब में खोला जाएगा, जिसमें नए पेज पर कोई रेफ़रलकर्ता जानकारी नहीं भेजी जाएगी। लिंक का पाठ "बाहरी लिंक" होगा।
बाहरी लिंक क्या है
रिएक्ट राउटर में एक बाहरी लिंक एक लिंक है जो उपयोगकर्ता को एप्लिकेशन के बाहर एक पृष्ठ पर ले जाता है। यह एक बाहरी वेबसाइट, या कोई अन्य एप्लिकेशन हो सकता है। बाहरी लिंक का उपयोग उपयोगकर्ताओं को एप्लिकेशन के भीतर सामग्री से संबंधित अतिरिक्त जानकारी या संसाधन प्रदान करने के लिए किया जाता है। उनका उपयोग उपयोगकर्ताओं को आगे की खोज के लिए अन्य एप्लिकेशन या वेबसाइटों पर निर्देशित करने के तरीके के रूप में भी किया जा सकता है।
रिएक्ट राउटर के साथ बाहरी लिंक कैसे जोड़ें
रिएक्ट राउटर में रिएक्ट राउटर के साथ एक बाहरी लिंक जोड़ना एक सीधी प्रक्रिया है। सबसे पहले, आपको प्रतिक्रिया-राउटर-डोम पैकेज से लिंक घटक आयात करने की आवश्यकता है। फिर, आप बाहरी URL का लिंक बनाने के लिए लिंक घटक का उपयोग कर सकते हैं। लिंक बनाने का सिंटैक्स इस तरह दिखता है:
उदाहरण के लिए, यदि आप Google के लिए एक लिंक बनाना चाहते हैं, तो यह ऐसा दिखाई देगा:
गूगल
एक बार जब आप अपना लिंक बना लेते हैं, तो आप बेहतर पहुंच और सुरक्षा उद्देश्यों के लिए लक्ष्य और rel विशेषताओं जैसे अतिरिक्त प्रॉप जोड़ सकते हैं। उदाहरण के लिए:
गूगल
