React-Dnd: Dynamic DropTarget et type DragSource

Question

Je suis en train de créer une liste glisser-déposer à plusieurs niveaux. Chaque liste imbriquée doit autoriser le glisser uniquement en son sein. Cela nécessite de définir un temps d'exécution type pour les codes DragSource et DropTarget.

Compile temps type travaux de déclaration, mais est limitée

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

Runtime type déclaration semble fonctionner, mais renvoie des erreurs sur glisser

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

Ac En ce qui concerne le document react-dnd, le type pourrait être 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.