蚂蚁轮播在内部无法正常反应DND

Question

我已经通过使用reactDND实现了卡的拖放。现在，我想在这些卡片中包含一个蚂蚁轮播。每当我将卡从一个地方移到另一个地方时，由于转盘宽度，另一张卡片的区域也会被拾取和移动。

代码：

return connectDragSource(connectDropTarget(
    <div key={card.updated_at} style={{ ...style, opacity }} >
    <div className="parentCard" onClick={this.CardModal}>
    {columns.map(
        (columnsData, i) => {
        if (columnsData.app_type === 'attachment') {
            return (
                card[columnsData.column_id] ?
                    <div className="carouselHolder" key={card[columnsData.column_id]}>
                    <Carousel {...settings} beforeChange={this.beforeChange} afterChange={this.afterChange} ref={node => (this.carousel = node)} {...props}>
                    {card[columnsData.column_id].map((data, i) => {
                        // e.preventDefault();
                        return (
                            <div onClick={(e) => e.preventDefault()} className='imgHolder' key={i}>
                            <img className={`activeImage${i}`} src={data.url} />
                            </div>
                        )
                    })}
                    </Carousel>
                    <div className="prevIcon">
                    <Icon type="left-circle" onClick={(e) => { this.previous(e) }} />
                    </div>
                    <div className="nextIcon">
                    <Icon type="right-circle" onClick={(e) => { this.next(e) }} />
                    </div>
                    </div>
                : null
            )
        }}
    )}
    </div>
    </div>
));