Bootstrap Blazor Timer 计时器组件

原文链接：https://www.cnblogs.com/ysmc/p/16184049.html

组件介绍

　　Timer 计时器组件，用于计时，提供良好的用户视觉体验。

　　可通过设置 Value 属性 或者 直接页面上进行选择设定倒计时时间，支持鼠标滚轮选择，如果是手机端，组件还提供震动反馈效果。

组件使用

razor

<Timer OnTimeout="@OnTimeout" OnCancel="OnCancel" />

cs

private Task OnTimeout()
{
     return Task.CompletedTask;
}

private Task OnCancel()
{
     return Task.CompletedTask;
}

效果展示

计时时间选择

 

 倒计时效果

 

Attributes 属性

参数	说明	类型	可选值	默认值
Width	组件宽度	int	—	300
StrokeWidth	进度条宽度	int	—	6
IsVibrate	倒计时结束时设备震动	bool	true/false	true
Value	倒计时时间	Timespan	—	—
Color	进度条颜色	Color	Primary / Secondary / Success / Danger / Warning / Info / Dark	Primary

写在最后

　　希望大佬们看到这篇文章，能给项目点个star支持下，感谢各位！

star流程：

1、访问点击项目链接：BootstrapBlazor   

2、点击star，如下图，即可完成star，关注项目不迷路：

 

另外还有两个GVP项目，大佬们方便的话也点下star呗，非常感谢：

　　BootstrapAdmin 项目地址：
　　https://gitee.com/LongbowEnterprise/BootstrapAdmin

　　SliderCaptcha 项目地址：
　　https://gitee.com/LongbowEnterprise/SliderCaptcha

 

交流群（QQ）欢迎加群讨论

　　     BA & Blazor ①（795206915）　　　　　　　   BA & Blazor ②（675147445）