Question

我想设置从主页“ /”到某些默认子页面的重定向。我的示例代码如下：

function FakeAdmin() {
  return(
    <div>
      Admin<br/>
      <a href="#/dashboard">Dashboard</a><br/>
      <a href="#/anything-else">Anything else</a><br/>

      <Switch>
        <Route path="/dashboard">
          <p>DASHBOARD</p>
        </Route>
        <Route path="/anything-else">
          <p>ANYTHING ELSE</p>
        </Route>
      </Switch>
    </div>
  )
}

ReactDOM.render(
  <HashRouter>
    <Switch>
      <FakeAdmin/>
      <Redirect from="/" to="/dashboard" />
    </Switch>
  </HashRouter>,
  document.getElementById("root")
)

我希望当我访问此页面“ /”时，它应该自动重定向到“ /＃/ dashboard”位置。但事实并非如此。仅通过单击伪导航链接。我在做什么错了？

Answer 1

您遇到的问题是，您将FakeAdmin和Redirect包装在Switch中，因此当渲染FakeAdmin时，Switch将停止渲染其子级中的其他任何内容。您不需要切换，而是使用React.Fragment

ReactDOM.render(
  <HashRouter>
    <React.Fragment>
      <FakeAdmin/>
      <Redirect from="/" to="/dashboard" />
    </React.Fragment>
  </HashRouter>,
  document.getElementById("root")
)

React HashRouter无法从主页重定向到后页

1 个答案: