如何在没有mapDispatchToProps的情况下进行连接

Question

我正在阅读redux的示例文档,我发现了这个容器组件的例子.有人可以解释为什么在这种情况下不需要mapDispatchToProps.同样,函数如何获得调度功能？

import React from 'react'
import { connect } from 'react-redux'
import { addTodo } from '../actions'

let AddTodo = ({ dispatch }) => {
let input

return (
    <div>
      <form onSubmit={e => {
        e.preventDefault()
        if (!input.value.trim()) {
          return
        }
        dispatch(addTodo(input.value))
        input.value = ''
      }}>
        <input ref={node => {
          input = node
        }} />
        <button type="submit">
          Add Todo
        </button>
      </form>
    </div>
  )
}
AddTodo = connect()(AddTodo)

export default AddTodo

Answer 1

connect()(AddTodo)将dispatch作为一个prop to AddTodo组件传递,即使没有状态或预定义的操作,它仍然有用.多数民众赞成mapDispatchToProps在您的代码中不需要原因

现在,在您的组件let AddTodo = ({ dispatch }) => {中,您将对道具进行解构以仅访问dispatch.

如果您使用了mapDispatchToProps自己,则可以将您的addTodo操作作为组件的支柱使用,然后将其称为this.props.addTodo.所以上面的方法是另一种选择.这取决于你选择你觉得舒服的东西

connect只是store / dispatch通过React上下文,所以你不必通过许多组件传递商店.您不必使用连接.任何模块/ HOC模式都可以工作,连接恰好是一个方便的东西.

使用dispatch的组件或使用mapDispatchToProps是同一个东西.

但是,使用mapDispatchToProps可以更灵活地构建代码并将所有动作创建者放在一个位置.

根据文档:

[mapDispatchToProps(dispatch,[ownProps]):dispatchProps](对象或函数):

如果传递了一个对象,则其中的每个函数都被假定为Redux动作创建者.具有相同函数名称的对象,但每个动作创建者都包含在一个调度调用中,因此可以直接调用它们,它们将合并到组件的props中.

如果传递了一个函数,它将被赋予dispatch作为第一个参数.由您来返回一个以某种方式使用dispatch以您自己的方式绑定动作创建者的对象.(提示:您可以使用bindActionCreators()Redux 的帮助程序.)

如果你的mapDispatchToProps函数被声明为带两个参数,它将使用dispatch作为第一个参数调用,props将作为第二个参数传递给连接的组件,并且只要连接的组件接收到新的props,就会重新调用它.(第二个参数通常按惯例称为ownProps.)

如果您不提供自己的mapDispatchToProps函数或对象充满动作创建者,则默认mapDispatchToProps 实现只是将调度注入组件的props.