如何在反应路由器v4中使用props.params设置补丁

时间:2017-07-20 08:41:59

标签: reactjs react-router

在之前的版本中反应路线v4。我可以写

<Route path='OrdersView(&filters:filters)'

<Route path='OrderViewForm/classPartition=:classPartition&id=:id'

使用后就像这样:

this.props.location.query.filter
this.props.params.classPartition

如何在版本反应路由器v4中执行此操作?

1 个答案:

答案 0 :(得分:0)

使用带参数

的路线的简单示例
import React from 'react'
import { BrowserRouter as Router, Route } from 'react-router-dom'

import Topic from '../topic'

export default function App() {
  return (
    <Router>
      <div>
        <Route path="/topics/:name" component={Topic} />
      </div>
    </Router>
  );
}

并像这样使用

import React from 'react'

export default function Topic(props) {
  return <h1>{props.match.params.name}</h1>
}

来源: https://jaketrent.com/post/access-route-params-react-router-v4/