वहाँ है एक समाधान के लिए LinkContainer घटक से प्रतिक्रिया-रूटर-बूटस्ट्रैप त्रुटि?

0

सवाल

तो मैं का उपयोग कर रहा हूँ LinkContainer घटक से प्रतिक्रिया-रूटर-बूटस्ट्रैप लपेट के लिए मेरा एनएवी.लिंक घटक से बूटस्ट्रैप. के लिए कृपया देखें नीचे चित्र संदर्भ के लिए ।

// Snippet
import {LinkContainer} from "react-router-bootstrap";

// Snippet

              <LinkContainer to="/cart">
                <Nav.Link class="navlink">
                  <FaShoppingCart /> Cart
                </Nav.Link>
              </LinkContainer>

// Snippet

लेकिन मैं इस त्रुटि हो रही है मेरे कोड के साथ: [त्रुटि फोटो][1] [1]: https://i.stack.imgur.com/AF41y.png

वैसे, मैं कर रहा हूँ का उपयोग कर प्रतिक्रिया v. 17.0.2 और प्रतिक्रिया-रूटर-बूटस्ट्रैप v. 0.25.0

मैं पूछना चाहूँगा अगर किसी को भी मदद कर सकते हैं, या चाहिए मैं बस बदलने के अपने संस्करण मेरी प्रतिक्रिया-रूटर-बूटस्ट्रैप या यहां तक कि उपयोग के लिए एक प्रतिक्रिया-रूटर-घटक के बजाय.

आप पहले से धन्यवाद.

2

सबसे अच्छा जवाब

1

मैं पहले से ही हल हो गई समस्या है ।

का उपयोग कर के बजाय एक LinkContainer घटक से react-router-bootstrap, मैं सिर्फ इस्तेमाल किया as संपत्ति के अंदर <Nav.Link> और सेट के रूप में अपने मूल्य के Link घटक के react-router-dom:

// Here's the code snippet

/* instead of using react-router-bootstrap, we're just going to use the Link component from the react-router-dom */

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

function Header () {
return(
<Nav.Link as={Link} to="/path">children</Nav.Link>
);
}

export Header

मैं प्रयोग किया जाता से जवाब इस सवाल के लिए संदर्भ: ReactJS बूटस्ट्रैप नेवबार और मार्ग नहीं एक साथ काम कर रहे

2021-11-24 04:07:43
0

मैं भी मुद्दों के साथ LinkContainer लपेटकर एक एनएवी.लिंक के रूप में इस प्रकार है:

<Navbar.Collapse id='basic-navbar-nav'>
    <Nav className='me-auto'>
         <LinkContainer to='/'>
               <Nav.Link>Home</Nav.Link>
          </LinkContainer>

मैं का उपयोग कर रहा हूँ इस निर्भरता:

 "react-bootstrap": "^2.0.2",
        "react-dom": "^17.0.2",
        "react-router-bootstrap": "^0.25.0",
        "react-router-dom": "^6.0.2",
        "react-scripts": "4.0.3"

मैं इस त्रुटि हो रही है जब चल रहा है एनपीएम शुरू करने के लिए मेरी वेबसाइट देखें क्रोम ब्राउज़र में:

TypeError: (0 , _reactRouterDom.withRouter) एक समारोह में नहीं है ./node_modules/react-router-bootstrap/lib/LinkContainer.js

S:/Kuarsis/webapps/kuarsis/frontend/node_modules/react-router-bootstrap/lib/LinkContainer.js:155
  152 |   strict: false,
  153 |   activeClassName: 'active'
  154 | };
> 155 | exports.default = (0, _reactRouterDom.withRouter)(LinkContainer);

के बाद से मैं LinkContainer पर एक और बड़ी परियोजना है, जो है का उपयोग कर प्रतिक्रिया-रूटर-डोम 5.0.0 के बजाय, 6.0.2, मैं रद्द की 6.0.2 के साथ

npm uninstall react-router-dom

और फिर स्थापित संस्करण 5.0.0 के साथ:

npm i [email protected]

कि तय LinkContainer मुद्दा है और वेबपेज बस ठीक काम किया.

ऐसा लगता है वहाँ एक असंगति समस्या के बीच प्रतिक्रिया-रूटर-बूटस्ट्रैप के नवीनतम संस्करण को प्रतिक्रिया-रूटर-डोम 6.0.2, या उचित तरीका स्थापित करने के लिए बदल गया है और मैं नहीं देखा है नवीनतम निर्देश पर कैसे बनाने के लिए उन्हें एक साथ काम.

आशा है कि इस मदद करता है, और अगर किसी और अधिक अंतर्दृष्टि बनाने के लिए कैसे पर 6.0.2 काम के बिना वापस रोलिंग के लिए संस्करण 5.0.0 की प्रतिक्रिया-रूटर-डोम, कृपया हमें पता है.

2021-11-24 02:47:44

धन्यवाद Silverio
wizby_

का उपयोग कर के बजाय LinkContainer से बूटस्ट्रैप मैं लिंक का इस्तेमाल किया घटक से प्रतिक्रिया रूटर डोम तब उपयोग के रूप में संपत्ति से बूटस्ट्रैप navlink घटकों. आप जाँच कर सकते हैं जवाब है कि मैं प्रकाशित किया गया था अधिक जानकारी के लिए.
wizby_

अन्य भाषाओं में

यह पृष्ठ अन्य भाषाओं में है

Русский
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................

इस श्रेणी में लोकप्रिय

लोकप्रिय सवाल इस श्रेणी में