Redux не диспетчерское действие

Question

Я использую React-dnd в сочетании с Redux, но не могу отправить действие.Мое действие называется, но редуктор никогда не называется:

const spelSource = {
    drop(props, monitor) {
        updateD(monitor.getItem(), props.spel);
    }
};

const mapDispatchToProps = {
    updateD: (newS, oldS) => updateDeck(newS, oldS),
};

export default connect(
    null, mapDispatchToProps
)(Spel)

Spel = DropTarget('spel', spelSource, collect)(Spel);

, а в моем действии:

export function updateD(newS, oldS) {
    console.log("update");
    return function (dispatch) {
        return dispatch({
            type:"UPDATE_D",
            newS: newS,
            oldS: oldS
        });
    };
}

Наконец, редуктор:

    case 'UPDATE_D':
        return Object.assign({}, state, {
            d: finalUpdate(state, action)
        });

Есть лиспособ отправки?Спасибо!

Answer 1

может быть ошибкой, что действие возвращает функцию вместо объекта.И эта внутренняя функция никогда не вызывается.

Я бы ожидал увидеть что-то вроде:

const mapDispatchToProps = dispatch => {
  return {
    updateD: (newS, oldS) => dispatch({
            type:"UPDATE_D",
            newS: newS,
            oldS: oldS
        })
  }
}

Answer 2

Вы пытаетесь отправить из действия, но вам нужно Redux для отправки самого действия.Ваше действие должно просто вернуть объект с type свойством и полезной нагрузкой (что угодно).Действие оборачивается в функцию dispatch() функцией connect() с mapDispatchToProps.Традиционно вам это нравится ...

const mapDispatchToProps = dispatch => ({
  updateD: (newS, oldS) => dispatch(updateDeck(newS, oldS))
});

Есть несколько более коротких способов сделать это в этой статье , но это традиционный способ.Вы можете видеть, что функция connect() принимает это и передает его через dispatch() метод хранилища Redux.

Тогда ваше действие просто вернет объект:

export const UPDATE_D = 'UPDATE_D';

export const updateD = (newS, oldS) => ({
    type: UPDATE_D,
    newS,
    oldS
});

Наконец, ваш редуктор:

switch (action.type) {
  case UPDATE_D:
    return {
      ...state,
      newS: action.newS,
      oldS: action.oldS
     };
     default:
       return state;
   }

Answer 3

Вам необходимо использовать this.props для правильной отправки этого действия от вашего компонента.

Например, в spelSource, this.props.updateD(monitor.getItem(), props.spel)