Question

在这里找不到问题可能是一个错字，但我想我已经按照文档进行了..

index.js：

ReactDOM.render(
  <Router history={hashHistory}>
    <Route path="/" component={App}></Route>
    <Route path="/match:id" component={MatchFeedComponent}></Route>
    <Route path="/user" component={UserPageComponent}></Route>
    <Route path="/comments" component={CommentHolderComponent}></Route>
    <Route path="/post-talk" component={AddTalkComponent}></Route>
    <Route path="/add-match" component={AddMatchComponent}></Route>
  </Router>,
  document.getElementById('app')
);

在我的

<Link to={{ pathname:"/match/", query: {id: this.id}}}>

我得到： [react-router] Location "/match/?id=-KXKIhpF8mdWDn9C5Tnd" did not match any routes

没有任何参数它可以正常工作，但现在无法找到它。

Answer 1

React Router通常无法使用“常规查询”，至少如何设置它。您的路由器需要/match/-KXKIhpF8mdWDn9C5Tnd而不是/match/?id=-KXKIhpF8mdWDn9C5Tnd。试试这个Link：

<Link to={`/match/${this.id}`}>

然后将您的路线更改为：

<Route path="/match/:id" component={MatchFeedComponent}></Route>

Answer 2

如果您希望“id”成为查询字符串参数，则它不应出现在您的路线中。改为：

<Route path="/match" component={MatchFeedComponent}></Route>

...然后从组件中的props.location.query中获取id

给定参数时，React Router无法正常工作

2 个答案: