How to capture mouse in onmousemove
event in Blazor like UIElement.CaptureMouse()
in WPF?
西装外套。如何在onmousemove事件中捕获鼠标?
评论
请
登录后发表观点
-
这是一个小示例,展示了如何在显示ClientX值的同时将鼠标移至div上:
<div style="background-color:aliceblue" @onmousemove="@((args) => mousemove=args.ClientX.ToString())"> Move the mouse over the div element</div> <p>ClientX: @mousemove</p> @code{ private string mousemove; }
注意:@onmousemove指令的值是具有单个参数MouseEventArgs的lambda表达式。当鼠标移到div的表面上时,会不断触发mousemove事件,并且 将类型为MouseEventArgs的args参数传递给我们的方法,在将其转换为字符串值之后,将其分配给该方法,并将其分配给显示其值的变量...
希望这可以帮助!
-
...在Blazor中就像UIElement.CaptureMouse()
The closest match would be
Element.setPointerCapture()
In order to use it you will need to get an ElementReference in Blazor with
@ref
and a JS method to invoke setPointerCapture on it. You need to pass a pointerId that you get from PointerEventArgs.不要使用与Mouse *相关的事件/方法,它们在JS中或多或少不推荐使用。
因此,您可以从以下内容开始:
<div @ref="myTarget" @onpointerdown="StartCapture"> ... </div> @code{ ElementReference myTarget; async Task StartCapture(PointerEventArgs args) { await JSRuntime.InvokeVoidAsync("myJsFunctions.capturePointer", myTarget, args.PointerId); } }