使用React DnD拖动卡时出现无限循环

Question

我正在使用React DnD将卡片拖到看板中。仍然想尽我所能，但我的DropTarget隔离了一个问题。

一旦我开始拖动卡，就会出现无限循环，这是由对我的商店的dispatch调用导致的，以重新配置电路板。

/* draggable-card.js */

const DraggableCard = ({isDragging, isSpacer, connectDragSource, connectDropTarget}) => {

  return _.flowRight(connectDragSource, connectDropTarget)(
    <div
      className={classNames('Card', {
        'Card--dragging': isDragging,
        'Card--spacer': isSpacer,
      })}
    >
      /* Card JSX goes here */
    </div>
  )
}

export default _.flowRight([
  connect(),
  DropTarget(
    'Card',
    {
      hover(props, monitor) {
        const {columnId, index, dispatch} = props
        const draggingItem = monitor.getItem()

        if (draggingItem.id !== props.id) {

          // this action is dispatched to my redux store where the 
          // card configuration is changed to reflect the card in the new position
          dispatch(moveCardAction({
            srcCardId: draggingItem.id,
            destColumnId: columnId,
            destIndex: index,
            dispatch
          }))
        }
      },
    },
    connect => ({
      connectDropTarget: connect.dropTarget(),
    })
  ),
  DragSource(
    'Card',
    {
      beginDrag(props) {
        return {id: props.id}
      },

      isDragging(props, monitor) {
        return props.id === monitor.getItem().id
      },
    },
    (connect, monitor) => ({
      connectDragSource: connect.dragSource(),
      isDragging: monitor.isDragging(),
    })
  )
])(DraggableCard)

可以拾起并拖动卡，但是在商店中调用dispatch方法（在卡拖动时状态改变以反映新板），无限循环开始掌控一切。

在React Dnd世界中是否从此dispatch方法内部调用hover？有什么方法可以在拖动时更新存储，而不会导致无限循环/堆栈溢出？