React-Redux Routing TypeError：this.props.match未定义

Question

我是路由新手，一直在努力寻找能用它做什么。

我希望能够将params传递给嵌套的路由/组件。我可以将params传递给第一个组件SurveyList。但在调查部分，参数仍未定义。

有办法做到这一点吗？

路线：

    <Switch>
      <Route path="/" exact component={Home} />
      <Route path="/aboutus/:username" component={AboutUs} />
      <Route path="/survey/" component={SurveyList} >
          <Route path="/page/:id/" component={Survey} />             
      </Route>

      <Route component={NotFound} />
    </Switch>

调查列表

  eachSurvey(newText, i){
    return(
      <Survey key={i} index={i}>
        {newText.title}
        {newText.desc}

      </Survey>);
  }

    renderList() {
        return (
                <li>
                  {this.props.surveys.map(this.eachSurvey)}
                </li>
        );
      }

    render() {
        return (
          <div id="newSurveyButton">
          <RaisedButton containerElement={<Link to="survey/page/1"/>} label="Add new Survey" onClick={() => this.props.addSurvey("Titel Survey", "Survey beschrijving")}></RaisedButton>
            <ul>
                {this.renderList()}
            </ul>
          </div>
        );
    }

调查组件渲染：

<div className="surveyContainer">
  <p>{this.props.match.params.id}</p>
  <div className="surveyTitle">{this.props.children[0]}</div>
  <div className="surveyDesc">{this.props.children[1]}</div>
  <RaisedButton label="Add new Page" onClick={() => this.props.addPage("title Page", "Page desc")}></RaisedButton>
  <button onClick={this.edit} className="button-primary">Edit</button>
  <RaisedButton label="Show Page" onClick={() => this.selectPage(0)} className="showPage"></RaisedButton>
  {this.renderPage()