Q:

React HashRouter can not redirect from main page to a sup-page

I would like to set up a redirect from the main page "/" to some default sub-page. My sample code is the following:
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")
)

I expect that when I'm visiting this page "/" it should automatically redirect to the "/#/dashboard" location. But it doesn't. Only by clicking the pseudo navigation links. What I'm doing wrong?

A:

The problem in your case is that, you wrap FakeAdmin and Redirect within a Switch, so when FakeAdmin gets rendered, Switch stop rendering anything else that follows in its children. You don't need a switch, instead use React.Fragment
ReactDOM.render(
  <HashRouter>
    <React.Fragment>
      <FakeAdmin/>
      <Redirect from="/" to="/dashboard" />
    </React.Fragment>
  </HashRouter>,
  document.getElementById("root")
)

