React-grid-layout: Can you specify a part of the component as a drag handle?

[szt19980425]

Can you specify a part of the component as a drag handle?
I added a component, and found that dragging conflicts with events inside the component, making the component unusable. I want to be able to specify that only a certain part of the component can be dragged inside the component

[Doesntmeananything]

Yes, take a look at grid-layout-props:

// A CSS selector for tags that will act as the draggable handle.
// For example: draggableHandle:'.MyDragHandleClassName'
// If you forget the leading . it will not work.
draggableHandle: ?string = '',

You should be able to target an element with a CSS selector in order to make it a drag handle. For example, if you add a class to your element like this:

<MyComponent>
  <div className="drag-handle"></div>
</MyComponent>

Then you can target it from GridLayout like this:

<GridLayout draggableHandle=".drag-handle">
{props.children}
</GridLayout>

Hope this helps.

[github-actions[bot]]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this issue will be closed in 7 days