react-router匹配查询字符串

提问于 2024-05-06T02:10:30+08:00

浏览次

3

https://github.com/reactjs/react-router/example

我在 npm start 试过这个例子

查询字符串匹配到路由不适用于该示例 . 当我点击第二个时，它正在激活错误的一个

http://localhost:8080/query-params/user/bob?showAge=1并刷新上面的链接，不匹配任何路由 .

即使我已将示例代码更改为 <Route path="user/:userID(?:showAge)" component={User} /> 以下，我尝试了几个可能基于文档工作的东西，但没有一个工作 .

我错过了什么吗？

2 回答

1
您缺少path =“user /：userID（？：showAge）”中的根（/）

此代码必须有效：
```
<Router history={history}>
    <Route path="/user/:userID/:showAge)" component={User} />
  </Router>
```
检查params是否在路线中：
```
console.log(JSON.stringify(this.props.routeParams));
```
我的整个档案：

https://github.com/aarkerio/vet4pet/blob/master/app/assets/frontend/javascripts/entry.js
回复于 2024-05-06T02:10:30+08:00
1
原来在react-router github上的示例有错误 .

我为它制作了一个PR，它删除了链接组件的 activeClassName .

没有它，它工作正常，查询字符串在位置道具，见下文
```
this.props.location.query = { 
  query1: value1,
  query2: value2
}
```
this picture
回复于 2024-05-06T02:10:30+08:00

相关问题