javascript - react - ¿Puedo mapDispatchToProps sin mapStateToProps en Redux?

react redux mapstate to props

Question

Estoy separando el ejemplo de Redux para intentar entenderlo. Leí que mapDispatchToProps permite asignar acciones de despacho como accesorios, así que pensé en reescribir addTodo.js para usar mapDispatchToProps en lugar de llamar a dispatch (addTodo ()). Lo llamándole addingTodo() . Algo como esto:

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

let AddTodo = ({addingTodo}) => {
  let input;
  return (
      <div>
        <form onSubmit={e => {
          e.preventDefault()
          if (!input.value.trim()) {
            return
          }
          addingTodo(input.value)
          input.value = ""
        }}>
          <input ref={node => {
            input = node
          }} />
          <button type="submit">Submit</button>
        </form>
      </div>
  )
}

const mapDispatchToProps = {
  addingTodo: addTodo
}

AddTodo = connect(
  mapDispatchToProps
)(AddTodo)

export default AddTodo

Sin embargo, cuando ejecuto la aplicación, Error: Invalid value of type object for mapStateToProps argument when connecting component AddTodo. este error: Error: Invalid value of type object for mapStateToProps argument when connecting component AddTodo. . Nunca usé mapStateToProps para comenzar con el componente AddTodo, por lo que no estaba seguro de qué estaba mal. Mi instinto dice que connect() espera que mapStateToProps preceda a mapDispatchToProps .

El original de trabajo se ve así:

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">Submit</button>
        </form>
      </div>
  )
}

AddTodo = connect()(AddTodo)

export default AddTodo

El repositorio completo se puede encontrar here .

Entonces mi pregunta es, ¿es posible hacer mapDispatchToProps sin mapStateToProps? ¿Es lo que estoy tratando de hacer una práctica aceptable? Si no, ¿por qué no?

Answer 1

Sí tu puedes. Simplemente pase null como primer argumento:

AddTodo = connect(
    null,
    mapDispatchToProps
)(AddTodo)

Sí, no es solo una práctica aceptable, es una forma recomendada de activar acciones. El uso de mapDispatchToProps permite ocultar el hecho de usar redux dentro de sus componentes de reacción