React-Dnd：動態DropTarget和DragSource類型

Question

我正在構建一個多級可嵌套拖放列表。每個嵌套列表只需要在其內部進行拖動。這需要爲DragSource和DropTarget設置運行時間type。

編譯時間type申報的作品，但有限

export default flow(
    DropTarget(ItemLevel.ROOT, target, connect => ({ 
    connectDropTarget: connect.dropTarget(), 
    })), 
    DragSource(ItemLevel.ROOT, source, (connect, monitor) => ({ 
    connectDragSource: connect.dragSource(), 
    isDragging: monitor.isDragging(), 
    })), 
)(MenuItem) 

運行type聲明似乎工作，但在拖動拋出錯誤

export const getGroupMenuItem = menuGroupId => flow(
    DropTarget(menuGroupId, target, connect => ({ 
    connectDropTarget: connect.dropTarget(), 
    })), 
    DragSource(menuGroupId, source, (connect, monitor) => ({ 
    connectDragSource: connect.dragSource(), 
    isDragging: monitor.isDragging(), 
    })), 
)(MenuItem) 

Answer 1

交流根據反應-dnd文件，類型可能是a function which is given component's props. This drop target will only react to the items produced by the drag sources of the specified type or types.