1. 首先，需要在前端创建一个DateTime类型的变量来存储用户输入的日期，如下所示：

@page "/"



@code {
    DateTime inputDate;
}

2. 接下来，需要使用JavaScript的Date对象来获取用户选择的小时数，然后将其存储在变量中。在Blazor中，可以使用JsInterop来实现：

在index.html中引入js文件：

在getHour.js中编写获取小时数的函数：

window.getHour = function(dateString) {
    var date = new Date(dateString);
    return date.getHours();
}

然后，在Blazor组件中调用该函数，如下所示：

@page "/"



@code {
    DateTime inputDate;
    int hour;

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            hour = await JSRuntime.InvokeAsync("getHour", inputDate.ToString());
            StateHasChanged();
        }
    }
}

3. 最后，可以在Blazor组件中使用获取到的小时数进行其他操作，如向后端发送请求或者进行计算等。