在Blazor中实现可移动<div>

Question

我试图将其实现为可在Blazor中移动的组件，但是我不确定如何将JavaScript转换为Blazor。 我通常希望达到以下目标：https://stackoverflow.com/a/47596086/767942

• 如何处理@o​​nmousedown并将其翻译为Blazor，以实现上例中的可移动
  ？

Answer 1

这是使用ondragstart和ondragend事件的另一种方法，我使用该事件来创建可移动的“弹出窗口”

<div draggable="true"
     @ondragend="OnDragEnd" ondragstart="OnDragStart"
     style="position:absolute; top: @(offsetY)px; left: @(offsetX)px; border-color: black;">
   <div>your content</div>
</div>

@code {
private double startX, startY, offsetX, offsetY;

private void OnDragStart(DragEventArgs args) {
        startX = args.ClientX;
        startY = args.ClientY;
    }

    private void OnDragEnd(DragEventArgs args) {
        offsetX += args.ClientX - startX;
        offsetY += args.ClientY - startY;
    }
}