如何在Blazorise中使用24小时制格式的TimeEdit组件
Blazorise TimeEdit 24小时制配置指南
Blazorise TimeEdit 默认会跟随系统区域设置展示时间格式,如需强制配置为24小时制,可通过以下两种方案实现:
方案1:全局配置(全项目所有TimeEdit生效)
在项目服务注册文件(通常为Program.cs)的Blazorise初始化配置中,指定全局时间输入格式:
builder.Services.AddBlazorise(options => { // 如需展示秒可调整为 "HH:mm:ss" options.TimeInputFormat = "HH:mm"; });
方案2:单组件独立配置(仅当前TimeEdit生效)
无需修改全局配置,直接在对应TimeEdit组件上声明Format属性即可:
<TimeEdit TValue="TimeSpan?" Format="HH:mm" @bind-Value="yourSelectedTimeField" />
注意:时间格式符严格区分大小写,
HH对应24小时制(取值00-23),hh对应12小时制(取值01-12),若配置后仍展示12小时制,优先检查格式符拼写。
Blazor 项目可替代的同类时间选择组件推荐
- 原生Blazor
InputTime:Blazor框架内置组件,无需引入第三方依赖,轻量化适配简单场景,直接指定format属性即可配置24小时制。 - MudBlazor TimePicker:Material Design风格组件库配套时间选择器,支持24/12小时制切换、时间范围限制等丰富功能,配置24小时制仅需设置
ClockMode="ClockMode.TwentyFourHour"。 - Ant Design Blazor TimePicker:遵循蚂蚁设计规范的组件,支持自定义步长、禁用时间段等功能,24小时制配置逻辑和Blazorise一致,直接指定
Format="HH:mm"即可,上手成本低。 - Radzen Blazor TimePicker:开源免费组件,支持内联/弹窗两种展示模式,可绑定
DateTime、TimeSpan多种类型的值,设置Format="HH:mm"即可启用24小时制。
内容的提问来源于stack exchange,提问作者Soudabeh Parsa
相关产品推荐
相关产品推荐

