我正在读 react-redux上的API 并查看Redux的一个github示例: Redux todo app
其中一个容器, FilterLink
, 具有 mapDispatchToProps
(和 mapStateToProps
)接受两个论点,其中一个是 ownprops。
const mapDispatchToProps = (dispatch, ownProps) => ({
onClick: () => {
dispatch(setVisibilityFilter(ownProps.filter))
}
})
API文档说:
“如果你的mapStateToProps函数声明为带两个参数,它将以store状态作为第一个参数调用,props将作为第二个参数传递给连接组件,并且每当连接组件接收到新参数时也会被重新调用通过浅等式比较确定的道具。(第二个参数通常按惯例称为ownProps。)“
我仍然无法完全掌握它的作用。有人可以解释一下 ownProps
用不同的例子呢?
ownProps
是使用组件时传递的属性。在简单的React中,这些将被称为道具。
例如在 Footer.js FilterLink用作:
<FilterLink filter="SHOW_ALL">
All
</FilterLink>
因此将调用mapStateToProps方法 ownProps
有价值:
{
"filter": "SHOW_ALL",
"children": ...
}
该 mapStateToProps
方法在Redux-wrapped组件中用于组合显式传递的属性(ownProps
)由Redux商店处理的状态进入 props
被包裹的组件。
所以在您的链接示例中 FilterLink
const mapStateToProps = (state, ownProps) => ({
active: ownProps.filter === state.visibilityFilter
})
该组件是活跃的(this.props.active == true
)如果 filter
属性(例如SHOW_ALL)匹配 visibiltyFilter
在 state
,即它当前是否被此值过滤。
ownProps
是使用组件时传递的属性。在简单的React中,这些将被称为道具。
例如在 Footer.js FilterLink用作:
<FilterLink filter="SHOW_ALL">
All
</FilterLink>
因此将调用mapStateToProps方法 ownProps
有价值:
{
"filter": "SHOW_ALL",
"children": ...
}
该 mapStateToProps
方法在Redux-wrapped组件中用于组合显式传递的属性(ownProps
)由Redux商店处理的状态进入 props
被包裹的组件。
所以在您的链接示例中 FilterLink
const mapStateToProps = (state, ownProps) => ({
active: ownProps.filter === state.visibilityFilter
})
该组件是活跃的(this.props.active == true
)如果 filter
属性(例如SHOW_ALL)匹配 visibiltyFilter
在 state
,即它当前是否被此值过滤。