React-Router- Bootstrap <LinkContainer>Ошибка: не следует использовать за пределами <Router>- проблема Гэтсби? - PullRequest
Новая
       68

React-Router- Bootstrap <LinkContainer>Ошибка: не следует использовать за пределами <Router>- проблема Гэтсби?

0 голосов
/ 04 февраля 2020

Я создаю проект с использованием Sanity и Gatsby. js. Я использую реагирование - bootstrap. Ссылка, которую я пытаюсь создать с помощью LinkContainer от Reaction-router- bootstrap

Но я не могу заставить ее работать. В процессе разработки я получаю сообщение об ошибке: Инвариант не удался: вы не должны использовать за пределами

Я довольно новичок в React, но кажется, что это относится к компоненту? Мог ли Гэтсби. js вмешаться в это? Понятия не имею, с чего начать :) Я следил за очень короткой документацией на странице activ-router- bootstrap. Это мой текущий код ## 

  import React from "react"
  import {NavItem} from "react-bootstrap";
  import {LinkContainer} from 'react-router-bootstrap';

  class GetNavItem extends React.Component {
    render() {
      const {item} = this.props;

      let link = item.link
      if (link === "home")
        link = "/"

      return (
          <LinkContainer to={link} activeClassName="active">
            <NavItem eventKey={1}>{item.title}</NavItem>
          </LinkContainer>
      )
    }
  }

What am I doing wrong here? :)

1 Ответ

0 голосов
/ 05 февраля 2020

Вы должны использовать <LinkContainer > внутри Router 

export default function App() {
  return (
    <div className="App"> 
      <Router>    
       <GetNavItem />

      <Route path='/about' component={About} />
      <Route path='/' component={Home} />
      </Router>>
    </div>
  );
}

посмотрите на этот образец , может быть полезно

...