react-redux中的ownProps是什么？

  • Z时代
  • 2024-01-10
  • 分类：问答

我正在阅读react-redux上的API并查看Redux的github示例之一：Redux

todo应用

其中一个容器FilterLink具有mapDispatchToProps（和mapStateToProps）接受两个参数，其中一个是ownprops。

const mapDispatchToProps = (dispatch, ownProps) => ({
  onClick: () => {
    dispatch(setVisibilityFilter(ownProps.filter))
  }
})

API文档说：

“如果您的mapStateToProps函数声明为带有两个参数，则它将以存储状态作为第一个参数，并将传递给连接组件的props作为第二个参数来调用，并且只要连接的组件收到新的参数，就会重新调用通过浅等式比较确定的道具。（根据惯例，第二个参数通常称为ownProps。）”

我仍然无法完全掌握它的作用。有人ownProps可以用另一个例子解释什么吗？

回答：

ownProps是使用组件时传递的属性。简而言之，这些将被称为道具。

例如在Footer.js中，FilterLink用作：

<FilterLink filter="SHOW_ALL">
  All
</FilterLink>

因此，将使用ownProps具有以下值的mapStateToProps方法：

{
  "filter": "SHOW_ALL",
  "children": ...
}

该mapStateToProps方法用于Redux包装的组件中，以将显式传递的属性（ownProps）和Redux存储所处理的状态组合到props包装组件的中。

所以在您的链接示例中 FilterLink

const mapStateToProps = (state, ownProps) => ({
  active: ownProps.filter === state.visibilityFilter
})

this.props.active == true如果filter属性（例如SHOW_ALL）与visibiltyFilterin

匹配state，则该组件处于活动状态（），即当前是否由该值过滤。

以上是 react-redux中的ownProps是什么？ 的全部内容， 来源链接： utcz.com/qa/419002.html

回到顶部