Question

我正在尝试从一页 App.js 转移到 addWork.js。我在 App.js 中添加了一个按钮将用户重定向到 addWork.js 但奇怪的是页面重定向到同一页面（App.js 接口）但 URL 更改为 addWork。

我在 render() 中使用了以下代码：

<Router>
    <Route>
    <button type="button" id="Add-new-work" > <Link to='/addWork'>Add new work</Link></button>
    </Route>
   </Router>

Answer 1

您需要在 index.js 文件中导入并添加路径。如下：

    <Route>
      <Route component={AddWork} path='addWork' />   
    </Route>

您没有指定路径，这就是它重定向到同一页面的原因

Answer 2

除了指定您的 Route 组件外，不要忘记将 exact 添加到 / 路由。如果您没有这样做，并且您的家乡路线在其他路线之上，您将继续导航到主页。

您的代码应该类似于：

    <Router>
        <Route exact path="/">
            <button type="button" id="Add-new-work">
                <Link to='/addWork'>
                   Add new work
                </Link>
            </button>
        </Route>
        <Route path="/addWork">
            you are in the addWork Route!
        </Route>
   </Router>

在反应中从一个页面重定向到另一个页面

2 个答案: