fix(node): add click handler when draggable is false #271

This commit is contained in:
moklick
2020-07-15 16:55:35 +02:00
parent 960699fff9
commit dad5d8e928
2 changed files with 13 additions and 2 deletions
+7
View File
@@ -11,6 +11,10 @@ const initialElements = [
{ id: 'e1-3', source: '1', target: '3' }, { id: 'e1-3', source: '1', target: '3' },
]; ];
const onNodeDragStart = (node) => console.log('drag start', node);
const onNodeDragStop = (node) => console.log('drag stop', node);
const onElementClick = (element) => console.log('click', element);
const InteractionFlow = () => { const InteractionFlow = () => {
const [elements, setElements] = useState(initialElements); const [elements, setElements] = useState(initialElements);
const onConnect = (params) => setElements((els) => addEdge(params, els)); const onConnect = (params) => setElements((els) => addEdge(params, els));
@@ -28,6 +32,9 @@ const InteractionFlow = () => {
nodesDraggable={isDraggable} nodesDraggable={isDraggable}
zoomOnScroll={zoomOnScroll} zoomOnScroll={zoomOnScroll}
onConnect={onConnect} onConnect={onConnect}
onElementClick={onElementClick}
onNodeDragStart={onNodeDragStart}
onNodeDragStop={onNodeDragStop}
> >
<MiniMap /> <MiniMap />
<Controls /> <Controls />
+6 -2
View File
@@ -238,11 +238,15 @@ export default (NodeComponent: ComponentType<NodeComponentProps>) => {
const onSelectNodeHandler = useCallback(() => { const onSelectNodeHandler = useCallback(() => {
if (!isDraggable && isSelectable) { if (!isDraggable && isSelectable) {
setSelectedElements({ id, type } as Node); setSelectedElements(node);
if (onClick) {
onClick(node);
}
} }
return noop; return noop;
}, [isSelectable, isDraggable, id, type]); }, [isSelectable, isDraggable, node]);
useEffect(() => { useEffect(() => {
if (nodeElement.current) { if (nodeElement.current) {