如何解决React Redux中的DispatchToProps方法
我一直在进行一些反应-还原代码,我被卡在下面的代码片段中
const mapDispatchToProps=dispatch=>({
addComment: (dishId,rating,author,comment) => dispatch(addComment(dishId,comment))
})
我不是Java经验丰富的人,所以最好弄清楚mapDispatchToProps方法的作用。
我知道这个方法是什么,我只是对Javascript部分感到困惑
解决方法
mapDispatchToProps
是redux中connect
函数的第二个参数。 mapStateToProps
是第一个。您将mapDispatchToProps
定义为dispatch
的函数,该函数返回一个对象。语法const something = dispatch => ({ ... })
是返回对象的箭头函数的简写。几乎与
function mapDispatchToProps(dispatch){
return {
addComment: (dishId,...) => dispatch(addComment(dishId,...))
}
}
当您将mapDispatchToProps
馈送到connect
,然后将组件包装在该connect
中时,它将返回的对象的属性和方法作为道具注入到组件中。因此,名称为mapXToProps
。通常将这样使用:
export default connect( mapStateToProps,mapDispatchToProps )(Component)
如果没有mapStateToProps
,请使用null
代替。 mapDispatchToProps
允许您将redux动作注入到组件中,以便可以通过组件上的props影响redux存储。 mapStateToProps
类似-它允许您从redux商店中获取项目,并将其分配给组件上的props。在您的示例中,您现在可以作为包装组件上的道具访问this.props.addComment
。这是您将组件连接到redux存储的方式,以及如何将数据发送和接收到存储的方式。
请注意,这些只是命名约定。实际上,您可以随意命名这些函数-但是大多数人使用mapStateToProps
和mapDispatchToProps
来形容正在发生的事情。您可以将它们命名为puppy
和booya
进行所有还原,只要您将它们正确地喂入connect
。
必填read the docs。虽然坦率地说,当我学习此内容时,也有人不得不向我解释,但是文档是一个很好的资源。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。