Не работает NavLink, проект основан на этом репозитории
https://github.com/conplementAG/ReactSSRTypescript...
App.tsx
import React from 'react';
import { Route, Switch } from 'react-router-dom';
import './app.scss';
import Register from '../register/register';
import Login from '../login/login';
import Home from '../home/home';
import Footer from '../footer/footer';
import Profile from '../profile/profile';
import Wallets from '../wallets/wallets';
export default class App extends React.PureComponent {
public render() {
return (<div className="d-flex flex-column h-100">
<Switch>
<Route exact={true} path="/" component={Home}/>
<Route exact={true} path="/register" component={Register}/>
<Route exact={true} path="/login" component={Login}/>
<Route exact={true} path="/profile" component={Profile}/>
<Route exact={true} path="/wallets" component={Wallets}/>
</Switch>
<Footer/>
</div>);
}
}
import PropTypes from 'prop-types';
import { NavLink, withRouter, RouteProps } from 'react-router-dom';
import './top-nav.scss';
import * as React from 'react';
export default class TopNav extends React.Component {
public render() {
return (<nav className="navbar navbar-expand-lg navbar-dark bg-dark">
<a className="navbar-brand" href="#">Navbar</a>
<button
className="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span className="navbar-toggler-icon"> </span>
</button>
<div className="collapse navbar-collapse" id="navbarSupportedContent">
<ul className="navbar-nav mr-auto">
<li className="nav-item active">
<NavLink to="" className="nav-link">
Home
<span className="sr-only">(current)</span>
</NavLink>
</li>
<li className="nav-item">
<a className="nav-link" href="#">Link</a>
</li>
<li className="nav-item dropdown">
<a
className="nav-link dropdown-toggle"
href="#"
id="navbarDropdown"
role="button"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Dropdown
</a>
<div className="dropdown-menu" aria-labelledby="navbarDropdown">
<a className="dropdown-item" href="#">Action</a>
<a className="dropdown-item" href="#">Another action</a>
<div className="dropdown-divider" />
<a className="dropdown-item" href="#">Something else here</a>
</div>
</li>
<li className="nav-item">
<a className="nav-link disabled" href="#" tabIndex={-1} aria-disabled="true">Disabled</a>
</li>
</ul>
<span className="navbar-text mr-2">+7 (999) 999-99-99</span>
<NavLink to="\login" className="btn btn-success mr-2">Вход</NavLink>
<NavLink to="\register" className="btn btn-success mr-2">Регистрация</NavLink>
</div>
</nav>);
}
}
Средний
Простой
Простой