营销型网站案例,创建网站的过程,网站包括什么,网红商城软件DevExpress Blazor UI组件使用了C#为Blazor Server和Blazor WebAssembly创建高影响力的用户体验#xff0c;这个UI自建库提供了一套全面的原生Blazor UI组件#xff08;包括Pivot Grid、调度程序、图表、数据编辑器和报表等#xff09;。
DevExpress Blazor控件目前已经升级…DevExpress Blazor UI组件使用了C#为Blazor Server和Blazor WebAssembly创建高影响力的用户体验这个UI自建库提供了一套全面的原生Blazor UI组件包括Pivot Grid、调度程序、图表、数据编辑器和报表等。
DevExpress Blazor控件目前已经升级到v24.1版本了此版本发布了全新文件输入组件、Drawer组件、Toast组件等欢迎下载最新组件体验
DevExpress v24.1正式版下载
全新的File Input文件输入组件
DevExpress Blazor全新的File Input文件输入组件允许您将文件上传功能引入Blazor应用程序而无需使用上传控制器创建单独的Web API项目。 DevExpress Blazor File Input控件支持多种上传模式即时和OnButtonClick可以同时上传多个文件并允许您在客户端和服务器上验证文件大小和扩展名。
处理FilesUploading事件来上传所选文件对于每个文件事件提供一个流您可以打开它来读取文件内容。读取操作完成后您可以将文件发送到其他目的地、保存到文件系统或在网页上显示文件内容。
下面的代码片段配置FileInput将文件上传到指定的文件夹
Razor
DxFileInput FilesUploadingOnFilesUploading /code {
async Task OnFilesUploading(FilesUploadingEventArgs args) {
foreach (var file in args.Files) {
Stream? stream default;
var filePath full path to the uploaded file;
FileStream fs new(filePath, FileMode.Create);
try {
if(IsValidFile(file)) {
stream file.OpenReadStream(int.MaxValue);
await stream.CopyToAsync(fs);
}
}
catch (Exception ex) {
if (file.CancellationTokenSource.IsCancellationRequested)
// Handle the cancel action here
}
finally {
await fs.FlushAsync();
fs.Close();
if (stream ! null)
stream.Close();
}
}
}
}
注意在将文件上传功能添加到您的Blazor应用程序之前请确保制定必要的安全相关流程以避免风险并控制未经授权的文件操作。
全新的Drawer组件
DevExpress Blazor 全新的Drawer组件允许您在Web应用程序中添加一个“可忽略的”导航侧板该控件包括以下功能
左侧和右侧位置。重叠和收缩显示模式。最小化drawer状态。页眉、正文和页脚模板。 全新的Toast通知组件
DevExpress Blazor 全新的Toast组件允许您通知用户有关进程和事件的信息。通知消息可以保持可见直到用户单击关闭按钮或在预定的时间后自动关闭。DevExpress Blazor Toast组件支持四种主题模式深色、浅色、粉彩和饱和和以下通知样式
危险信息重要成功警告 您可以在标记中放置DxToast组件并调用Show方法来显示它。
Razor
DxToastProvider NameToastContainer /
DxToast reftoast TextThe process has been completed. ProviderNameToastContainer /code {
DxToast toast;protected override void OnAfterRender(bool firstRender) {
toast.Show();
}
}
/lang
/code2para
Alternatively, use the notification service to create toasts at runtime.
/paracode2
lang brushrazor nameRazor
DxToastProvider NameToastContainer /code {
[Inject] IToastNotificationService ToastService { get; set; }protected override void OnAfterRender(bool firstRender) {
ToastService.ShowToast(new ToastOptions {
ProviderName ToastContainer,
Text The process has been completed.
});
}
}
在这两种情况下都必须将DxToastProvider组件添加到页面中。该组件用作通知容器应该在显示通知的地方声明。
全新的Progress Bar进度条
DevExpress Blazor全新的Progress Bar进度条组件允许您与最终用户沟通正在进行的进程状态当进度无法估计时组件可以显示无限的移动条。该控件包括以下综合功能
水平、垂直和圆形布局四个状态指示进程状态InProgress、Warning、Error和Success不确定的状态元素自定义图标、标签和条的厚度 全新的Bar Gauge量规
DevExpress Blazor 全新的Bar Gauge允许您将数据显示为圆形条形其中每个条形表示单个值。该组件具有以下功能
几何和布局配置面板自定义输出和打印支持实时数据更新量规元素定制标签、工具提示、图例等。