Control the draggable( object to X or Y when dragged

<div draggable="true" onDragOver={rowDragOver} onDrop={rowDrop} onDragStart={rowDragStart}>draggable</div>

It can be dragged by mouse control,

however now I want to control drag position only on X axis or Y axis,

I found out there is some libraris for this purpose.

However I would like to make this by normal javascript.

If make this ,I think I have to control the dragged(transparent) object when user dragging by mouse.

Maybe in this function, am I correct ? or how can I make this?

const rowDragOver = (e) =>{
  console.log("rowDragStart dragover:");
  e.stopPropagation();
  e.preventDefault();
}