Javascript 当我单击a时，React Router 4.1.1不会渲染<；链接>；

我只是试图点击一个组件，让react重新渲染需要渲染的内容。但我无法将其存档。这就是我到目前为止所做的：

Index.js（这是我试图存储所有路由的地方）

签名

    import React from "react";
    import Header from "./../header.js";
    import Qoute from "./qoute.js";
    import Form from "./form.js";
    export default class Login extends React.Component {
        render() {
            return(
          <div>
          <Header />
            <section id="info">
              <div className="containor">
                <div className="row">
                  <Qoute />
                  <Form />
                </div>
              </div>
            </section>
          </div>
            );
        }
    }

从“React”导入React；
从“/./Header.js”导入标题；
从“/Qoute.js”导入Qoute；
从“/Form.js”导入表单；
导出默认类登录扩展React.Component{
render（）{
返回(
);
}
}

为了澄清，我尝试了

<Route exact path="/" component={Main}/>

---

但这仍然不起作用。有解决方案吗？

现在您在

标记中有

元素。您必须删除此

，链接开始工作。

尝试将Header.js更改为

import React from "react";
import style from "./../acc/css/navbar.css";
import { BrowserRouter as Router, Link} from "react-router-dom";
export default class Header extends React.Component {
    render() {
        return (
    <section className={style.nav} id="nav">
            <ul>
        <li><Link to="/">Home</Link></li>
        <li><Link to="/login">Login</Link></li>
            </ul>
        </section>
        );
    }
}

从“React”导入React；
从“/./acc/css/navbar.css”导入样式；
从“react Router dom”导入{BrowserRouter as Router，Link}；
导出默认类标头扩展React.Component{
render（）{
返回(

家
登录

);
}
}

---

然后点击它显示的链接。

你能尝试一下

相同的结果吗：（你只需要在你的父组件中定义路由器一次。顺便说一句，在你的路由中使用“component={（）=>}”，而不是“render={Home}”。你能包括你的主组件和主组件的代码吗？我以前只做过“render”的尝试是当我在某个地方看到一个答案，表明哪两种解决方案都不起作用。我将编辑我的问题，并包括主组件和登录组件。我不确定主组件是什么意思！某些组件阻止更新。如果使用react-redux或react.PureComponent，则必须与Router（）一起使用传播更新。文档：相关问题：

    import React from "react";
    import Header from "./../header.js";
    import Qoute from "./qoute.js";
    import Form from "./form.js";
    export default class Login extends React.Component {
        render() {
            return(
          <div>
          <Header />
            <section id="info">
              <div className="containor">
                <div className="row">
                  <Qoute />
                  <Form />
                </div>
              </div>
            </section>
          </div>
            );
        }
    }

<Route exact path="/" component={Main}/>

import React from "react";
import style from "./../acc/css/navbar.css";
import { BrowserRouter as Router, Link} from "react-router-dom";
export default class Header extends React.Component {
    render() {
        return (
    <section className={style.nav} id="nav">
            <ul>
        <li><Link to="/">Home</Link></li>
        <li><Link to="/login">Login</Link></li>
            </ul>
        </section>
        );
    }
}