Blazor入门100天 : 自做一个支持长按事件的按钮组件

Densen2014

于 2024-02-09 12:08:34 发布

阅读量514

点赞数 9

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/alex_zoucn/article/details/136085905

本文介绍了如何在Blazor.NET8单工程中创建一个支持长按、点击和触控事件的LongPressButton组件，并在SSR模式下实现其功能，包括处理点击、长按时的回调和触摸设备检测。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

好长时间没继续写这个系列博客了, 不知道大家还记得我吗? 话不多说,直接开撸.

配套源码

demo https://blazor.app1.es/b19LongPressButton

####1. 新建 net8 blazor 工程 b19LongPressButton

至于用什么模式大家各取所需, 我创建的是ssr单工程, 如果大家不小心建立错了按页面渲染模式,可以在 App.razor 里面改一下, 加入 @rendermode=“RenderMode.InteractiveServer” 这句话, 默认使用ssr模式渲染.

<Routes @rendermode="RenderMode.InteractiveServer" />

####2. Components\Pages 下新建组件 LongPressButton.razor

@inherits ComponentBase

<div @onclick="onClick" @oncontextmenu="onContextMenu" @ontouchstart="OnTouchStart" @ontouchend="OnTouchEnd">
    @ChildContent
</div>

最低0.47元/天解锁文章