Question

我正在尝试使用react-router-dom {Link}导航到其他页面。但是，当我单击每个链接时，浏览器仍停留在当前页面上。我需要刷新网页才能转到目标页面。

Image for my Route in index.js file Image for my Link in CourseRow.js

            <td>
                <Link to='/course/2'>
                    {this.props.course.title}
                </Link>

            </td>

如何在不刷新的情况下导航到目标页面

谢谢

Answer 1

在这里您可以看到基本设置

import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter as Router, Route, Link } from "react-router-dom";

function App() {
  return (
    <Router>
      <Link to="/first">Go first</Link> <Link to="/second">Go second</Link>
      <Route path="/first" exact component={First} />
      <Route path="/second" exact component={Second} />
    </Router>
  );
}

function First() {
  return <div>First</div>;
}

function Second() {
  return <div>Second</div>;
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

刷新后React-router-dom链接路由到目标页面

1 个答案: