Question

所以我设置了React Router，我试图从WordPress运行它。

只要您从根＆＃34; /＆＃34;开始，应用就会正确路由。但是，如果您通过地址栏手动导航到任何子页面，React Router似乎只能从那里接管。

例如。

点击/将呈现主页。如果您点击链接＆＃39;样式指南＆＃39;它会正确地将你引导到/ style-guide并呈现页面。

但是，如果您在地址栏中手动导航到/ style-guide，则会在那里呈现主页，如果您现在单击样式指南链接，它将带您进入/ style-guide / style-guide < / p>

我需要做的是告诉react-router始终从根URL开始。

我的路线看起来像这样

import {
  BrowserRouter as Router,
  Route,
  Redirect,
  Switch,
} from 'react-router-dom'
import PageContainer from 'containers/pageContainer'

class RoutesList extends React.Component {
  render() {
    return (
      <Router>
        <div>
          <Switch>
            <Route path="/" component={PageContainer} />
            <Route path="style-guide" component={PageContainer} />
            <Route
              render={() => {
                return <Redirect to="/" />
              }}
            />
          </Switch>
        </div>
      </Router>
    )
  }
}

export default RoutesList

Answer 1

让您的路线准确路径

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

<Route exact path="/style-guide" component={PageContainer} />

React Router - 接管根URL

1 个答案: