mapStateToProps ownProps 参数为空
2017-08-29
5178
我是 React、React Router (v4) 和 Redux 的新手。我尝试通过访问
ownProps.match.params.id
从
mapStateToProps(state, ownProps)
访问 URL 参数,但
params
数组始终为空。我已使用调试器检查 ownProps,并且应传递的
id
参数不在
ownProps
的任何地方。
这是我的路线的片段:
<Switch>
<Route exact path='/' component={HomePage} />
<Route path='/about' component={AboutPage} />
<Route path='/course' component={ManageCoursePage} />
<Route path='/course/:id' component={ManageCoursePage} />
<Route path='/courses' component={CoursesPage} />
</Switch>
这是来自
ManageCoursePage.js
的相关代码:
class ManageCoursePage extends React.Component {
constructor(props, context) {
super(props, context);
this.state = {
course: Object.assign({}, props.course),
errors: {},
};
}
}
function mapStateToProps(state, ownProps) {
const courseId = ownProps.match.params.id;
...
}
export default connect(mapStateToProps, mapDispatchToProps)(ManageCoursePage);
1个回答
您必须翻转以下路线的顺序,或将
exact
属性设置为第一个路线。
<Route path='/course' component={ManageCoursePage} />
<Route path='/course/:id' component={ManageCoursePage} />
/course
在
/course/:id
之前匹配,这就是为什么调用
ManageCoursePage
时没有 id 参数。
如果您只想在第一个路线中匹配
/course
而不是
/course/123
,您可以设置
exact
属性
。
Steffen
2017-08-29