翻譯|產品更新|編輯:龔雪|2024-11-20 10:58:27.510|閱讀 103 次
概述:DevExpress?Blazor控件目前已經升級到v24.1版本了,此版本發布了全新文件輸入組件、Drawer組件、Toast組件等,歡迎下載最新組件體驗!
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關鏈接:
DevExpress Blazor UI組件使用了C#為Blazor Server和Blazor WebAssembly創建高影響力的用戶體驗,這個UI自建庫提供了一套全面的原生Blazor UI組件(包括Pivot Grid、調度程序、圖表、數據編輯器和報表等)。
DevExpress Blazor控件目前已經升級到v24.1版本了,此版本發布了全新文件輸入組件、Drawer組件、Toast組件等,歡迎下載最新組件體驗!
DevExpress技術交流群11:749942875 歡迎一起進群討論
DevExpress Blazor全新的File Input(文件輸入)組件允許您將文件上傳功能引入Blazor應用程序,而無需使用上傳控制器創建單獨的Web API項目。
 
 
DevExpress Blazor File Input控件支持多種上傳模式(即時和OnButtonClick),可以同時上傳多個文件,并允許您在客戶端和服務器上驗證文件大小和擴展名。
處理事件來上傳所選文件,對于每個文件,事件提供一個流,您可以打開它來讀取文件內容。讀取操作完成后,您可以將文件發送到其他目的地、保存到文件系統或在網頁上顯示文件內容。
下面的代碼片段配置FileInput將文件上傳到指定的文件夾:
Razor
<DxFileInput FilesUploading="OnFilesUploading" />
@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應用程序之前,請確保制定必要的安全相關流程(以避免風險并控制未經授權的文件操作)。
DevExpress Blazor 全新的Drawer組件允許您在Web應用程序中添加一個“可忽略的”導航側板,該控件包括以下功能:
 
 
DevExpress Blazor 全新的Toast組件允許您通知用戶有關進程和事件的信息。通知消息可以保持可見,直到用戶單擊關閉按鈕或在預定的時間后自動關閉。DevExpress Blazor Toast組件支持四種主題模式(深色、淺色、粉彩和飽和)和以下通知樣式:
 
 
您可以在標記中放置DxToast組件并調用方法來顯示它。
Razor
<DxToastProvider Name="ToastContainer" />
<DxToast @ref=toast Text="The process has been completed." ProviderName="ToastContainer" />
@code {
DxToast toast;
protected override void OnAfterRender(bool firstRender) {
toast.Show();
}
}
</lang>
</code2>
<para>
Alternatively, use the notification service to create toasts at runtime.
</para>
<code2>
<lang brush="razor" name="Razor">
<DxToastProvider Name="ToastContainer" />
@code {
[Inject] IToastNotificationService ToastService { get; set; }
protected override void OnAfterRender(bool firstRender) {
ToastService.ShowToast(new ToastOptions {
ProviderName = "ToastContainer",
Text = "The process has been completed."
});
}
}
在這兩種情況下,都必須將組件添加到頁面中。該組件用作通知容器,應該在顯示通知的地方聲明。
DevExpress Blazor全新的Progress Bar(進度條)組件允許您與最終用戶溝通正在進行的進程狀態,當進度無法估計時,組件可以顯示無限的移動條。該控件包括以下綜合功能:
 
 
DevExpress Blazor 全新的Bar Gauge允許您將數據顯示為圓形條形,其中每個條形表示單個值。該組件具有以下功能:
 
 
更多產品更新咨詢,請
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@ke049m.cn
文章轉載自:慧都網