ಪರಿಹರಿಸಲಾಗಿದೆ: url ರಿಯಾಕ್ಟ್ ರೂಟರ್ dom v6 ನಿಂದ ಪ್ರಶ್ನೆಯನ್ನು ಪಡೆಯಿರಿ

URL ರಿಯಾಕ್ಟ್ ರೂಟರ್ DOM v6 ನಿಂದ ಪ್ರಶ್ನೆಯನ್ನು ಪಡೆಯುವುದಕ್ಕೆ ಸಂಬಂಧಿಸಿದ ಮುಖ್ಯ ಸಮಸ್ಯೆಯೆಂದರೆ ಅದು ಪ್ರಶ್ನೆ ನಿಯತಾಂಕಗಳನ್ನು ಪ್ರವೇಶಿಸಲು ಅಂತರ್ನಿರ್ಮಿತ ಮಾರ್ಗವನ್ನು ಒದಗಿಸುವುದಿಲ್ಲ. ಬದಲಾಗಿ, ಡೆವಲಪರ್‌ಗಳು URL ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ಹಸ್ತಚಾಲಿತವಾಗಿ ಪಾರ್ಸ್ ಮಾಡಬೇಕು ಮತ್ತು ಪ್ರಶ್ನೆ ಪ್ಯಾರಾಮೀಟರ್‌ಗಳನ್ನು ಸ್ವತಃ ಹೊರತೆಗೆಯಬೇಕು. ಇದು ಬೇಸರದ ಪ್ರಕ್ರಿಯೆಯಾಗಿರಬಹುದು ಮತ್ತು ಸರಿಯಾಗಿ ಮಾಡದಿದ್ದರೆ ದೋಷಗಳಿಗೆ ಕಾರಣವಾಗಬಹುದು. ಹೆಚ್ಚುವರಿಯಾಗಿ, URL ರಚನೆಯು ಬದಲಾದರೆ, ಕೋಡ್ ಅನ್ನು ಅದಕ್ಕೆ ಅನುಗುಣವಾಗಿ ನವೀಕರಿಸಬೇಕಾಗಬಹುದು.

import { useLocation } from "react-router-dom";

const MyComponent = () => {
  const location = useLocation();

  const queryParams = new URLSearchParams(location.search);

  return (
    <div>
      <h1>My Component</h1>
      <p>Query Param: {queryParams.get("myParam")}</p>
    </div>
  );  
};

1. "'react-router-dom' ನಿಂದ {useLocation} ಅನ್ನು ಆಮದು ಮಾಡಿಕೊಳ್ಳಿ;" - ಈ ಸಾಲು ರಿಯಾಕ್ಟ್-ರೂಟರ್-ಡಾಮ್ ಲೈಬ್ರರಿಯಿಂದ ಯೂಸ್‌ಲೊಕೇಶನ್ ಹುಕ್ ಅನ್ನು ಆಮದು ಮಾಡಿಕೊಳ್ಳುತ್ತದೆ.
2. “const MyComponent = () => {” – ಈ ಸಾಲು MyComponent ಎಂಬ ಕಾರ್ಯವನ್ನು ಘೋಷಿಸುತ್ತದೆ, ಅದು ರಿಯಾಕ್ಟ್ ಘಟಕವನ್ನು ಹಿಂತಿರುಗಿಸುತ್ತದೆ.
3. “const location = useLocation();” - ಈ ಸಾಲು ಅಪ್ಲಿಕೇಶನ್‌ನ ಪ್ರಸ್ತುತ ಸ್ಥಳದ (ಉದಾ, URL) ಕುರಿತು ಮಾಹಿತಿಯನ್ನು ಪಡೆಯಲು ಆಮದು ಮಾಡಿದ ಯೂಸ್‌ಲೊಕೇಶನ್ ಹುಕ್ ಅನ್ನು ಬಳಸುತ್ತದೆ.
4. “const queryParams = ಹೊಸ URLSearchParams(location.search);” - ಈ ಸಾಲು ಪ್ರಸ್ತುತ URL ನಲ್ಲಿ ಎಲ್ಲಾ ಪ್ರಶ್ನೆ ನಿಯತಾಂಕಗಳನ್ನು ಒಳಗೊಂಡಿರುವ ವಸ್ತುವನ್ನು ರಚಿಸುತ್ತದೆ (ಉದಾ, ?myParam=foo).
5. ಉಳಿದ ಕೋಡ್ ಕೇವಲ h1 ಮತ್ತು p ಟ್ಯಾಗ್‌ನೊಂದಿಗೆ ರಿಯಾಕ್ಟ್ ಕಾಂಪೊನೆಂಟ್ ಅನ್ನು ಹಿಂತಿರುಗಿಸುತ್ತಿದೆ ಅದು URL ಪ್ರಶ್ನೆ ಸ್ಟ್ರಿಂಗ್‌ನಲ್ಲಿ myParam ಮೌಲ್ಯವನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ (ಅದು ಅಸ್ತಿತ್ವದಲ್ಲಿದ್ದರೆ).

ರಿಯಾಕ್ಟ್ ರೂಟರ್ ಡೊಮ್

ರಿಯಾಕ್ಟ್ ರೂಟರ್ DOM ಎಂಬುದು ರಿಯಾಕ್ಟ್‌ಗಾಗಿ ರೂಟಿಂಗ್ ಲೈಬ್ರರಿಯಾಗಿದ್ದು, ಡೆವಲಪರ್‌ಗಳು ತಮ್ಮ ರಿಯಾಕ್ಟ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳಲ್ಲಿ ಮಾರ್ಗಗಳನ್ನು ರಚಿಸಲು ಮತ್ತು ನಿರ್ವಹಿಸಲು ಅನುವು ಮಾಡಿಕೊಡುತ್ತದೆ. ಇದು ಅಪ್ಲಿಕೇಶನ್ ಅನ್ನು ನ್ಯಾವಿಗೇಟ್ ಮಾಡಲು API ಅನ್ನು ಒದಗಿಸುತ್ತದೆ, ಡೆವಲಪರ್‌ಗಳಿಗೆ ಮಾರ್ಗಗಳನ್ನು ಘೋಷಣಾತ್ಮಕವಾಗಿ ವ್ಯಾಖ್ಯಾನಿಸಲು, ಪ್ರಸ್ತುತ URL ಅನ್ನು ಆಧರಿಸಿ ಘಟಕಗಳನ್ನು ನಿರೂಪಿಸಲು ಮತ್ತು ಅಪ್ಲಿಕೇಶನ್‌ನ ವಿವಿಧ ಭಾಗಗಳ ನಡುವೆ ಲಿಂಕ್ ಮಾಡಲು ಅನುಮತಿಸುತ್ತದೆ. ಇದು ಡೈನಾಮಿಕ್ ರೂಟ್ ಮ್ಯಾಚಿಂಗ್, ಸ್ಥಳ ಟ್ರ್ಯಾಕಿಂಗ್ ಮತ್ತು ನ್ಯಾವಿಗೇಷನ್ ಗಾರ್ಡ್‌ಗಳಂತಹ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಸಹ ಬೆಂಬಲಿಸುತ್ತದೆ.

ರಿಯಾಕ್ಟ್ v6 ರೂಟರ್‌ನಲ್ಲಿ ನಾನು ಪ್ರಶ್ನೆ ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ಹೇಗೆ ಪಡೆಯುವುದು

v6

ರಿಯಾಕ್ಟ್ ರೂಟರ್ v6 ನಲ್ಲಿ, ಯೂಸ್‌ಲೊಕೇಶನ್ ಹುಕ್ ಅನ್ನು ಬಳಸಿಕೊಂಡು ನೀವು ಪ್ರಶ್ನೆ ಸ್ಟ್ರಿಂಗ್ ನಿಯತಾಂಕಗಳನ್ನು ಪ್ರವೇಶಿಸಬಹುದು. ಈ ಹುಕ್ ಪಥಹೆಸರು, ಹುಡುಕಾಟ, ಹ್ಯಾಶ್ ಮತ್ತು ರಾಜ್ಯದ ಗುಣಲಕ್ಷಣಗಳನ್ನು ಒಳಗೊಂಡಂತೆ ಪ್ರಸ್ತುತ URL ಕುರಿತು ಮಾಹಿತಿಯನ್ನು ಒಳಗೊಂಡಿರುವ ಸ್ಥಳ ವಸ್ತುವನ್ನು ಹಿಂತಿರುಗಿಸುತ್ತದೆ. ಹುಡುಕಾಟದ ಆಸ್ತಿಯು ಪ್ರಶ್ನೆ ಸ್ಟ್ರಿಂಗ್ ಪ್ಯಾರಾಮೀಟರ್‌ಗಳನ್ನು ಸ್ಟ್ರಿಂಗ್‌ನಂತೆ ಒಳಗೊಂಡಿದೆ. ಎಲ್ಲಾ ಪ್ರಶ್ನೆ ಸ್ಟ್ರಿಂಗ್ ನಿಯತಾಂಕಗಳನ್ನು ಹೊಂದಿರುವ ವಸ್ತುವನ್ನು ಪಡೆಯಲು ನೀವು ನಂತರ ಈ ಸ್ಟ್ರಿಂಗ್ ಅನ್ನು ಪಾರ್ಸ್ ಮಾಡಬಹುದು.
ಉದಾಹರಣೆಗೆ:
const {search} = useLocation();
const params = ಹೊಸ URLSearchParams(ಹುಡುಕಾಟ);
const param1 = params.get('param1');