反应路由器路径内的问号

Question

我试图在我的 URL 中传递参数，但我在阅读时遇到了问题。我正在使用 react-router v4。

URL： http://localhost:3000/reset?token=123 我试图这样阅读：

<Route
   path="/reset?token=:token"
   component={Reset}/>

但这会打印空对象console.log(this.props.match.params);。奇怪的是我试图将问号更改为其他字符，看起来它解决了我的问题，但无论如何我想保留问号。

网址： http://localhost:3000/reset_token=123

<Route
   path="/reset_token=:token"
   component={Reset}/>

这已经有效了console.log(this.props.match.params);。知道如何使问号也正确吗？对我来说真正重要的是继续使用 react-router 而没有任何外部库。

干杯，丹尼尔

Answer 1

你需要query-string

示例： http ://yoursite.com/page?search=hello

const queryString = require('query-string')

class ProductsPage extends React.Component {
  componentDidMount() {
    let search = queryString.parse(this.props.location.search).search
    console.log(search) // ==> hello
  }

...
}