Могу ли я mapDispatchToProps без mapStateToProps в Redux?


95

Я разбираю пример задачи Redux, чтобы попытаться понять его. Я читал, что это mapDispatchToPropsпозволяет отображать действия диспетчеризации в качестве свойств, поэтому я подумал о переписывании, addTodo.jsчтобы использовать mapDispatchToProps вместо вызова диспетчеризации (addTodo ()). Я назвал это addingTodo(). Что-то вроде этого:

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

Тем не менее, когда я запустить приложение, я получаю эту ошибку: Error: Invalid value of type object for mapStateToProps argument when connecting component AddTodo.. Я никогда не mapStateToPropsначинал с компонента AddTodo, поэтому не был уверен, что случилось. Моя интуиция говорит , что connect()ожидает mapStateToPropsпредшествует 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">Submit</button>
        </form>
      </div>
  )
}

AddTodo = connect()(AddTodo)

export default AddTodo

Полное репо можно найти здесь .

Итак, мой вопрос: можно ли использовать mapDispatchToProps без mapStateToProps? Является ли то, что я пытаюсь делать, приемлемой практикой - если нет, то почему?

Ответы:


145

Да, ты можешь. Просто передайте в nullкачестве первого аргумента:

AddTodo = connect(
    null,
    mapDispatchToProps
)(AddTodo)

Да, это не просто приемлемая практика, это рекомендуемый способ инициирования действий. Использование mapDispatchToPropsпозволяет скрыть факт использования redux внутри ваших реагирующих компонентов.


6
Но могу ли я таким же образом использовать mapStateToProps без mapDispatchToProps?
Велизар Андреев Китанов

6
@VelizarAndreevKitanov yes
iofjuupasli 06

23
При использовании only mapStateToPropsможно опустить второй аргумент connect. null
Проходить

1
Для обратного случая mapStateToProps без mapDispatchToProps не нужно передавать null. передавать только mapStateToProps
Раджеш Насит

2
connectдолжен был принять литерал объекта в качестве параметра вместо списка аргументов.
Махди Педрам
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.