Question

在redux docs上举例说明如何将其与react-router一起使用：

const App = ({ match: { params } }) => {
  return (
    <div>
      <AddTodo />
      <VisibleTodoList filter={params.filter || 'SHOW_ALL'} />
      <Footer />
    </div>
  )
}

假设redux和react-router都已正确设置，您如何将路由器参数传递给深度嵌套的组件，比如说VisibleTodoList下的3个级别？除了从App开始的每一个组件上传递它之外还有其他方法吗？ VisibleTodoList - ＆gt; NestedOne - ＆gt; ...？

Answer 1

使用来自react-router的withRouter（）。它将注入路由器参数。 VisibleTodoList.jsx的示例：

import { withRouter } from `react-router`;
const VisibleTotoList = ({ match: { params } }) => { ... }
export default withRouter(VisibleTotoList);

此处的文档https://reacttraining.com/react-router/web/api/withRouter

将路由器参数传递给深层嵌套组件

1 个答案: