ರಿಯಾಕ್ಟ್ ರೂಟರ್ DOM ಇಂಡೆಕ್ಸ್ರೀಡೈರೆಕ್ಟ್ಗೆ ಸಂಬಂಧಿಸಿದ ಮುಖ್ಯ ಸಮಸ್ಯೆ ಎಂದರೆ ಅದು ಅನಿರೀಕ್ಷಿತ ಮರುನಿರ್ದೇಶನಗಳಿಗೆ ಕಾರಣವಾಗಬಹುದು. ಏಕೆಂದರೆ ವೆಬ್ಸೈಟ್ನ ಮೂಲ URL ಅನ್ನು ಪ್ರವೇಶಿಸಿದಾಗ IndexRedirect ಘಟಕವು ಬಳಕೆದಾರರನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಿದ ಮಾರ್ಗಕ್ಕೆ ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಮರುನಿರ್ದೇಶಿಸುತ್ತದೆ. ಮೂಲ URL ನಲ್ಲಿ ಮುಖಪುಟ ಅಥವಾ ಇತರ ವಿಷಯವನ್ನು ನೋಡಲು ನಿರೀಕ್ಷಿಸುತ್ತಿರುವ ಬಳಕೆದಾರರಿಗೆ ಇದು ಗೊಂದಲಕ್ಕೊಳಗಾಗಬಹುದು. ಹೆಚ್ಚುವರಿಯಾಗಿ, ಬಳಕೆದಾರರು ಈಗಾಗಲೇ ನಿರ್ದಿಷ್ಟ ಪುಟಕ್ಕೆ ನ್ಯಾವಿಗೇಟ್ ಮಾಡಿದ್ದರೆ ಮತ್ತು ನಂತರ ಅವರ ಬ್ರೌಸರ್ ಅನ್ನು ರಿಫ್ರೆಶ್ ಮಾಡಿದರೆ, IndexRedirect ಅಂಶದಿಂದಾಗಿ ಅವರು ಆ ಪುಟದಿಂದ ಅನಿರೀಕ್ಷಿತವಾಗಿ ಮರುನಿರ್ದೇಶಿಸಬಹುದು.
import { BrowserRouter as Router, Route, IndexRedirect } from "react-router-dom"; <Router> <Route path="/"> <IndexRedirect to="/home" /> <Route path="/home" component={Home} /> <Route path="/about" component={About} /> </Route> </Router>
1. "'react-router-dom' ನಿಂದ {BrowserRouter ಅನ್ನು ರೂಟರ್, ರೂಟ್, IndexRedirect } ಆಗಿ ಆಮದು ಮಾಡಿಕೊಳ್ಳಿ;" - ಈ ಸಾಲು ರಿಯಾಕ್ಟ್-ರೂಟರ್-ಡಾಮ್ ಲೈಬ್ರರಿಯಿಂದ ಬ್ರೌಸರ್ರೂಟರ್, ರೂಟ್ ಮತ್ತು ಇಂಡೆಕ್ಸ್ರೀಡೈರೆಕ್ಟ್ ಘಟಕಗಳನ್ನು ಆಮದು ಮಾಡಿಕೊಳ್ಳುತ್ತದೆ.
2. "
3. "
4. "
5. "
6. "
7."" & "" - ಈ ಸಾಲುಗಳು ಕ್ರಮವಾಗಿ ಮಾರ್ಗಗಳು ಮತ್ತು ರೂಟರ್ ಘಟಕಗಳನ್ನು ಮುಚ್ಚುತ್ತವೆ
IndexRedirect ಎಂದರೇನು
IndexRedirect ಎನ್ನುವುದು ರಿಯಾಕ್ಟ್ ರೂಟರ್ನಲ್ಲಿನ ಒಂದು ಅಂಶವಾಗಿದ್ದು ಅದು ನಿಮ್ಮನ್ನು ಒಂದು ಮಾರ್ಗದಿಂದ ಇನ್ನೊಂದು ಮಾರ್ಗಕ್ಕೆ ಮರುನಿರ್ದೇಶಿಸಲು ಅನುಮತಿಸುತ್ತದೆ. ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್ನ ಮೂಲ URL ನಿಂದ ಬಳಕೆದಾರರನ್ನು ಮತ್ತೊಂದು ಮಾರ್ಗಕ್ಕೆ ಮರುನಿರ್ದೇಶಿಸಲು ನೀವು ಬಯಸಿದಾಗ ಇದನ್ನು ಬಳಸಲಾಗುತ್ತದೆ. ಉದಾಹರಣೆಗೆ, ನೀವು "/" ನ ರೂಟ್ URL ನೊಂದಿಗೆ ಅಪ್ಲಿಕೇಶನ್ ಹೊಂದಿದ್ದರೆ, ಬಳಕೆದಾರರು ರೂಟ್ URL ಗೆ ಭೇಟಿ ನೀಡಿದಾಗ "/home" ಗೆ ಮರುನಿರ್ದೇಶಿಸಲು ನೀವು IndexRedirect ಅನ್ನು ಬಳಸಬಹುದು.
IndexRedirect ಮಾಡುವುದು ಹೇಗೆ
React Router ನಲ್ಲಿ IndexRedirect ಎನ್ನುವುದು ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್ನ ಮೂಲ URL ನಿಂದ ಮತ್ತೊಂದು URL ಗೆ ಬಳಕೆದಾರರನ್ನು ಮರುನಿರ್ದೇಶಿಸುವ ಒಂದು ಮಾರ್ಗವಾಗಿದೆ. ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್ನ ಪ್ರಮುಖ ಪುಟಕ್ಕೆ ಬಳಕೆದಾರರನ್ನು ನಿರ್ದೇಶಿಸಲು ಅಥವಾ ಲ್ಯಾಂಡಿಂಗ್ ಪುಟವನ್ನು ರಚಿಸಲು ಇದು ಉಪಯುಕ್ತವಾಗಿದೆ.
ರಿಯಾಕ್ಟ್ ರೂಟರ್ನಲ್ಲಿ ಇಂಡೆಕ್ಸ್ರೀಡೈರೆಕ್ಟ್ ಮಾಡಲು, ನೀವು ಇದನ್ನು ಬಳಸಬೇಕಾಗುತ್ತದೆ
ಉದಾಹರಣೆಗೆ, ನಿಮ್ಮ ಮೂಲ URL (ಉದಾ, www.example.com) ಅನ್ನು ಭೇಟಿ ಮಾಡುವ ಬಳಕೆದಾರರನ್ನು www.example.com/home ಗೆ ಮರುನಿರ್ದೇಶಿಸಬೇಕೆಂದು ನೀವು ಬಯಸಿದರೆ, ನೀವು ಈ ರೀತಿಯ IndexRedirect ಅನ್ನು ಬಳಸಬಹುದು:
… ಇತರೆ ಮಾರ್ಗಗಳು…