mapDispatchToProps:有任何意义吗? [英] mapDispatchToProps: any point?

问题描述

我想知道今天使用 mapDispatchToProps 是否还有意义.我正在编写 redux 文档教程(构建待办事项列表)，其中VisibleTodoList 描述为:

I was wondering if there was still a point using mapDispatchToProps today. I'm working on the redux documentation tutorials (to build a todo list) where VisibleTodoList is described as:

import { connect } from 'react-redux'
import { toggleTodo } from '../actions'
import TodoList from '../components/TodoList'

const getVisibleTodos = (todos, filter) => {
  switch (filter) {
    case 'SHOW_ALL':
      return todos
    case 'SHOW_COMPLETED':
      return todos.filter(t => t.completed)
    case 'SHOW_ACTIVE':
      return todos.filter(t => !t.completed)
  }
}

const mapStateToProps = (state) => {
  return {
    todos: getVisibleTodos(state.todos, state.visibilityFilter)
  }
}

const mapDispatchToProps = (dispatch) => {
  return {
    onTodoClick: (id) => {
      dispatch(toggleTodo(id))
    }
  }
}

const VisibleTodoList = connect(
  mapStateToProps,
  mapDispatchToProps
)(TodoList)

export default VisibleTodoList

然而，今天有人告诉我，我可以简单地不定义 mapDispatchToProps 并通过以下方式连接所有内容:

However, I've been told that today, I could simply not to define mapDispatchToProps and connect everything through:

const VisibleTodoList = connect(
  mapStateToProps,
  toggleTodo
)(TodoList)

是吗?如果是这样，编写 mapDispatchToProps 有什么意义?简单地返回动作有什么缺点吗?

Is it right? And if so, what is the point to write a mapDispatchToProps? Is there any drawbacks to simply returning the action?

谢谢！

推荐答案

澄清另一个 Mark 的评论:

To clarify the other Mark's comment:

connect() 的第二个参数可以采用两种主要形式.如果你传递一个函数作为参数，connect() 假设你想自己处理调度准备，用 dispatch 作为参数调用你的函数，并将结果合并到组件的道具.

The second argument to connect() can take two main forms. If you pass a function as the argument, connect() assumes you want to handle dispatch preparation yourself, calls your function with dispatch as an argument, and merges the result into the props for your component.

如果您将一个对象作为第二个参数传递给 connect()，则它假定您已将道具名称映射提供给动作创建者，因此它会自动运行所有这些bindActionCreators 实用程序并将结果用作道具.

If you pass in an object as the second argument to connect(), it assumes you've given it a map of prop names to action creators, and so it automatically runs all of them through the bindActionCreators utility and uses the result as props.

但是，将 single 动作创建者作为第二个参数传递，正如您的示例所显示的那样，不会执行您想要的操作，因为 connect() 会解释作为一个准备函数，而不是一个需要绑定的动作创建者.

However, passing a single action creator as the second argument, as your example appears to do, would not do what you want, as connect() would interpret that as a preparation function and not an action creator that needs to be bound.

所以是的，connect() 支持传递一个充满动作创建者的对象作为第二个参数的速记语法，但仍然有很好的用例传递实际的 mapDispatchToProps 函数自己做事(特别是如果你的调度准备在某种程度上依赖于实际的道具值).

So yes, connect() supports a shorthand syntax of passing in an object full of action creators as the second argument, but there are still good use cases for passing in an actual mapDispatchToProps function to do things yourself (especially if your dispatch prep relies on the actual prop values in some way).

您可能需要参考 API 文档对于`connect().

这篇关于mapDispatchToProps:有任何意义吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！