Question

我对路线有疑问：

ReactDOM.render((
  <BrowserRouter>
    <div>
      <Route exact path="/" component={App} />
      <Route exact path="/dodajpost" component={addPost} />
      <Route path="/:id" component={App}/>
    </div>
  </BrowserRouter>
), document.getElementById('root'));

当我要转到/dodajpost时，它没有呈现addPost组件，则/:id位于/dodajpost上。

是否可以赋予/dodajpost更高的优先级？也许有不同的解决方法。

Answer 1

我建议您按照以下步骤操作：

首先，使用<Switch>，将<Route>分组不是必需的，但是当多个路径的路径与相同的路径名匹配时，它会非常有用。
关于优先级，<Switch>仅呈现与当前位置匹配的第一个
检查您当前的位置是否与'/dodajpost'
代替addPost使用AddPost，这是一种约定，即组件以大写字母开头

执行此操作，然后重试！

希望有帮助

Answer 2

您可以尝试

   ReactDOM.render((
      <BrowserRouter>
        <div>
          <Route path="/" component={App} />
          <Route exact path="/dodajpost" component={addPost} />
          <Route exact path="/:id" component={App}/>
        </div>
      </BrowserRouter>
    ), document.getElementById('root'));

React.js路由，通过参数链接

2 个答案: