มีทางออกสำหรับ LinkContainer ส่วนประกอบจากตอบโต้-router-bootstrap เกิดข้อผิดพลาด?

0

คำถาม

ดังนั้นฉันใช้ LinkContainer ส่วนประกอบจากตอบโต้-router-bootstrap ต้องห่อของฉันนำทาง.เชื่อมโยงส่วนประกอบจากบู๊ทสแตร็พ ได้โปรดเรียกรูปภาพข้างล่างสำหรับบุคคลอ้างอิงหรอก

// 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

โดยวิธีการที่ฉันใช้ตอบโต้รุ่นอายุ 170.2 และตอบโต้-Router-Bootstrap วีน 0อายุ 25 ปี0

ฉันอยากจะถามว่ามีใครสามารถช่วยฉันมั้ยหรือฉันควรจะเปลี่ยนของฉันเวอร์ชั่นของฉันตอบโต้-router-bootstrap หรือแม้กระทั่งใช้ตอบโต้-router-ส่วนประกอบแทน

ขอบคุณล่วงหน้า

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 Bootstrap Navbar และการเดินทางไม่ทำงานด้วยกัน

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>

ฉันกำลังใช้นี่ dependencies:

 "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"

ฉันได้ข้อผิดพลาดนี้ตอนที่กำลัง npm เริ่มที่จะเห็นต์บนเว็บไซต์ของฉันอยู่ใน Chrome องเบราว์เซอร์:

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 บอีกคโตโครงการ,ซึ่งก็คือใช้ตอบโต้-router-dom 5.0.0 แทนที่จะเป็น 6.0.2 ฉัน uninstalled ที่ 6.0.2 กับ

npm uninstall react-router-dom

และจากนั้นถูกติดตั้งที่ 5.0.0 เวอร์ชั่นด้วย:

npm i [email protected]

นั่นซ่อม LinkContainer ปัญหาและหน้าเว็บที่ถูกเขียนด้วยทำงานแค่สบายดี

มันดูเหมือนว่านั่นคือการ incompatibility นปัญหาระหว่างโต้ตอบ-router-bootstrap และล่าสุดของโต้ตอบ-router-dom 6.0.2 หรือคนที่เหมาะสมทางของการตั้งค่ามันเปลี่ยนแปลงไปและฉันยังไม่ได้เห็นรุ่นล่าสุดงวิธีที่จะทำให้พวกเขาทำงานด้วยกัน

หวังว่านี่คงช่วยแล้วถ้าใครมีข้อมูลเชิงลึกมากกว่าที่จะทำให้ 6.0.2 ทำงานโดยไม่กลิ้งกลับไปเวอร์ชั่น 5.0.0 ของโต้ตอบ-router-dom โปรดปล่อยให้พวกเรารู้

2021-11-24 02:47:44

ขอบคุณ Silverio
wizby_

แทนที่จะใช้ LinkContainer จาก bootstrap ฉันใช้เชื่อมโยงส่วนประกอบจากตอบโต้ router dom แล้ว utilized ที่เป็นทรัพย์สินจาก bootstrap navlink ส่วนประกอบ คุณสามารถตรวจสอบคำตอบที่ฉันโพสต์เพื่อรายละเอียดที่มากกว่านี้
wizby_

ในภาษาอื่นๆ

หน้านี้อยู่ในภาษาอื่นๆ

Русский
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
हिन्दी
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................

ดังอยู่ในนี้หมวดหมู่

ดังคำถามอยู่ในนี้หมวดหมู่