Question

我尝试使用Route的getComponent（）（https://github.com/ReactTraining/react-router/blob/master/docs/API.md#getcomponentnextstate-callback）向路由添加一些异步逻辑。我得到它主要工作，但坚持如何只接收与路径的当前节点片段相关的参数。

一个例子：

const getSampleComponent = (nextState, cb) => {
  console.log(nextState.params);
  cb(null, () => {    
    return <div><Link to="/test/1">/test/1</Link> <Link to="/test/1/test2/2">/test/1/test2/2</Link></div>
  });
}

function createRoutes() {
  return {
    path: '/',
    getComponent: getSampleComponent,
    childRoutes: [{
        path: "test/:id",
        getComponent: getSampleComponent,
        childRoutes: [{
          path: "test2/:id",
          getComponent: getSampleComponent
        }]
      }
    ]
  }
}


ReactDOM.render((
  <Router history={createMemoryHistory()} routes={createRoutes()} />
), document.getElementById('app'))

（正在运行的版本：http://jsbin.com/dedazozije/edit?html,js,console,output）

使用console.log(nextState.params);我可以列出所有参数，但是这些参数将包含整个匹配路径的参数，而不仅仅是节点。所以，如果我访问/ test / 1 / test2 / 2，它将是

[object Object] {
  id: ["1", "2"]
}

重复3次。我只想看看：

for / getComponent - 一个空对象
for test /：id getComponent - {id: 1}
for test2 /：id getComponent - {id: 2}

这个数据是在某个地方提供的，还是正在解析路径位置并将params与它匹配？

react-router - 只访问getComponent（）中给定的节点参数

0 个答案: