Blazor WebAssembly 应用程序中的 SyncFusion 前端错误

Question

我在 Blazor WebAssembly 中使用 Syncfusion，在我的本地服务器上构建应用程序时遇到问题。第一个问题是 Syncfusion 组件显示不正确：日历小部件（见图片）格式不正确。第二个问题是小部件没有功能：即按钮坏了。所有 Syncfusion 组件都会出现同样的问题。

这是日历组件在应用程序中的呈现方式：

我附上了项目中的一些相关代码片段。

Program.cs [片段]

using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web;
using Syncfusion.Blazor;

var builder = WebApplication.CreateBuilder(args);
builder.Services.AddSyncfusionBlazor();
var app = builder.Build();

app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseRouting();
app.MapBlazorHub();
app.MapFallbackToPage("/_Host");
app.Run();

Index.razor [片段]：

@using Syncfusion.Blazor
@using Syncfusion.Blazor.Calendars

<SfCalendar TValue="DateTime" />

Host.cshtml [片段]

<head>
    ...
    <link href="_content/Syncfusion.Blazor.Themes/bootstrap5.css" rel="stylesheet" />
    <!--Use below script reference if you are using Syncfusion.Blazor Single NuGet-->
    <script src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>
    <script src="_content/Syncfusion.Blazor/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>
</head>

<component type="typeof(App)" render-mode="ServerPrerendered" />

根据问题的性质，我假设我一定是遗漏了一些 CSS 和脚本导入。我尝试按照 Syncfusion 的 documentation 中的建议将引用添加到 Host.cshtml（该项目不使用 index.html），但

<head>

中的引用不会影响应用程序组件。

Answer 1

根据提供的详细信息，我假设您在带有预渲染的 Blazor WebAssembly 应用程序中使用了 Syncfusion Individual NuGet。

要解决此问题，您必须确保已参考 Syncfusion.Blazor.Themes NuGet。然后参考 this 了解有关使用预渲染创建 Blazor WebAssembly 应用程序的详细信息。

顺便说一下，你只需要引用Individual NuGet的脚本，但是你也引用了Single NuGet package的脚本，这是不必要的。

Blazor WebAssembly 应用程序中的 SyncFusion 前端错误

问题描述投票：0回答：1

1个回答

最新问题

Blazor WebAssembly 应用程序中的 SyncFusion 前端错误

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1