小编Jon*_*Lee的帖子

在使用react-router 4和styled-component进行响应时,不应在路由器外部使用Route或withRouter()

我正在尝试构建我的第一个投资组合网站,并使用react-router-dom 4.2.2和styled-components 2.2.3陷入路由.

错误消息:您不应在路由器外使用Route或withRouter()

我也尝试使用Link而不是NavLink,但也有错误(你不应该使用路由器外的链接)

请有人帮帮我.

navigationBar.js

import React, { Component } from 'react';
import { NavigationContainer, NavItem } from './navigationBar.style';

class NavigationBar extends Component {
  render() {
    return (
      <NavigationContainer>
        <NavItem to="/">Home</NavItem>
        <NavItem to="/projects">Project</NavItem>
      </NavigationContainer>
    );
  }
}

export default NavigationBar;
Run Code Online (Sandbox Code Playgroud)

navigationBar.style.js

import styled from 'styled-components';
import { Flex, Div } from 'theme/grid';
import { NavLink } from 'react-router-dom';

export const NavigationContainer = styled(Flex)`
  position: fixed;
  right: 20px;
  top: 0.5em;
  font-size: 1em;  
`;
export const NavItem …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-router styled-components

34
推荐指数
3
解决办法
5万
查看次数