react-router – 如何在中继容器之间传递变量

假设我有这些路由,在/ widgets /上的特定小部件列表上有一个全局小部件列表：WidgetListID.

注意：我使用react-router-relay

<Route
    path='/' component={Layout}
  >
    <IndexRoute
      component={WidgetListContainer}
      queries={ViewerQueries}
    />
    <Route
      path='/widgets/:WidgetListID'
      component={WidgetListContainer}
      queries={ViewerQueries}
    />
  </Route>

它是相同的< WidgetList />组件,在< WidgetListContainer />内呈现里面<布局/>以下是我尝试传递WidgetListID变量的方法：

Layout.js

class Layout extends React.Component {
  render() {
    return (
      <div>
       ...
        {children}
       ...
      </div>
    );
  }
}

WidgetListContainer.js

class WidgetListContainer extends React.Component {
  render () {
    return (
      <div>
       ...
        <WidgetList 
          viewer={viewer}
        />
      </div>
    )
  }
}

export default Relay.createContainer(WidgetListContainer,{
  initialVariables: {
    WidgetListID: null
  },fragments: {
    viewer: ($WidgetListID) => Relay.QL`
      fragment on User {
        ${WidgetList.getFragment('viewer',$WidgetListID)}
      }
    `,},})

WidgetList.js

class WidgetList extends React.Component {
  render () {
    return (
      <div>
        <ul>
          {viewer.widgets.edges.map(edge =>
            <li key={edge.node.id}>{edge.node.widget.name}</li>
          )}
        </ul>
      </div>
    )
  }
}
export default Relay.createContainer(WidgetList,fragments: {
    viewer: () => Relay.QL`
      fragment on User {
         widgets(first: 10,WidgetListID:$WidgetListID) { 
          edges { 
            node { 
              id,name
            } 
          } 
        } 
      }
    `,})

我没有问题直接在WidgetList中继容器内设置WidgetListID变量,它工作得很好,但是当我尝试从WidgetListContainer中继容器传递它时,我有一个空的数据对象{__dataID __：“VXNlcjo =”}.虽然,变量在我的getWidget()函数中打印得很好.所以某些东西在某些时候不起作用,但我无法弄清楚是什么？

将WidgetListID变量从父容器传递到子容器的好语法是什么？