I want to deactivate the drag and drop function for the table. Can anyone tell me how we can do this?
return(
<div
className="grid-container"
>
<table
className="grid-table"
onMouseLeave={() => props.handle_mouse(false)}
onMouseDown={() => props.handle_mouse(true)}
onMouseUp={() => props.handle_mouse(false)}
>
<tbody>
{grid}
</tbody>
</table>
</div>
)
You need to keep track of the disabled state of your drag n drop. and return nothing if the state says it's disabled.
let isDisabled = false
// Logic to handle `isDisabled` state that would set it to true
return(
<div
className="grid-container"
>
<table
className="grid-table"
onMouseLeave={() => props.handle_mouse(false)}
onMouseDown={() => isDisabled ? null : props.handle_mouse(true)}
onMouseUp={() => props.handle_mouse(false)}
>
<tbody>
{grid}
</tbody>
</table>
</div>
)