main.js
import React from 'react';
import {BrowserRouter as Router, Route, Switch, Link } from 'react-router-dom';
import home from './home';
import about from './about';
import menu from './menu';
import gallery from './gallery';
import franchise from './franchise';
const Main = () => (
<Switch>
<Route exact path ="/" component={home} />
<Route path ="/about" component={about} />
<Route path ="/menu" component={menu} />
<Route path ="/gallery" component={gallery} />
<Route path ="/franchise" component={franchise} />
</Switch>
)
export default Main;
nav.js
import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import { BrowserRouter as Router, Route } from 'react-router-dom';
import { Layout, Header, Navigation, Drawer, Content} from 'react-mdl';
import Main from './main';
export default class CustomNavbar extends Component {
render() {
return (
<div className="demo-big-content">
<Layout>
<Header title="CHEFSTYLE" scroll>
<Navigation>
<Link href="/" to="/">Home</Link>
<Link href="/about" to="/about">About</Link>
<Link href="/menu">Menu</Link>
<Link href="/gallery">Gallery</Link>
<Link href="/franchise">Franchise</Link>
</Navigation>
</Header>
<Drawer title="CHEFSTYLE">
<Navigation>
<Link href="/" to="/">Home</Link>
<Link href="/about" to="/about">About</Link>
<Link href="/menu">Menu</Link>
<Link href="/gallery">Gallery</Link>
<Link href="/franchise">Franchise</Link>
</Navigation>
</Drawer>
<Content>
<div className="page-content" />
<Main/>
</Content>
</Layout>
</div> )
}
}
Ошибка: инвариант завершился неудачно: вы не должны использовать инвариант за пределами D: /pandemic/pandemicmateria/kupsmaterial/node_modules/tiny-invariant/dist/tiny-invariant.esm.js: 11 (анонимная функция) D: / pandemic / pandemicmateria / modules / Link.js: 84 Я использую response-mdl для пользовательского интерфейса в реакции, если я использую тег Router вместо Switch в main.js и если я заключаю тег навигации с тегом Router в nav .js означает, что я не получаю никаких ошибок, но не получаю вывода ... я имею в виду, что страница не маршрутизируется относительно ссылок
<BrowserRouter>
обертки при рендеринге. Вот почему вы получаете эту ошибку.<Link
›должен находиться внутри<Router>
компонента, поэтому вы получаете это сообщение об ошибке. Или вы добавили где-то еще. - person norbitrial   schedule 15.01.2020