提问人：regestea23 提问时间：11/16/2023 更新时间：11/21/2023 访问量：81
如何在新的 Blazor .NET 8 Web 应用模板自动（服务器和 WebAssembly）中从 javascript 调用 C# 函数
How to call C# function from javascript in the new Blazor .NET 8 Web App Template Auto (Server and WebAssembly)
问：
这是我在 app.js 中的 JavaScript 函数，当窗口调整其大小时，调用在控制台中记录消息的 c# 函数
window.addEventListener('resize', function () {
DotNet.invokeMethodAsync("BlazorTest.Client", "SeyHello")
});
这是我的 C# 函数
[JSInvokable]
public static void SeyHello()
{
Console.WriteLine("Hello form js");
}
这是我的项目模板，交互式渲染模式是自动（服务器和 WebAssembly）
问题1：我应该把app.js放在哪里，因为我们在这个项目中有两个wwwroot
问题 2：如果我将 app.js 放在 BlazorTest.Client 中，如何在 BlazorTest 中将其引用到 App.razor
问题 3：我应该将 c# 函数放在 BlazorTest 或 BlazorTest.Client 中的什么位置
问题 4：在我放置 c# 函数的 razor 文件中，它应该是什么@rendermode
最后：我需要在新的 Blazor .NET 8 Web 应用模板中工作的代码
答：
0赞
regestea23
11/17/2023
#1
问题1：在这种情况下，只需将app.js放在wwwroot文件夹中之一，重要的是哪一个并不重要
问题 2：需要在 BlazorTest.Client 中定义一个名为 HeadContent.razor 的组件，并通过 HeadContent 标记引用 app.js，并在 BlazorTest 中使用 App.razor 中的组件
@rendermode InteractiveWebAssembly
<HeadContent>
<script src="/app.js"></script>
</HeadContent>
问题 3：您可以将其放在 BlazorTest.Client 或 BlazorTest 中，两者都可以正常工作
问题 4：它应该是客户端渲染，它是
@rendermode InteractiveWebAssembly
最后：
在 BlazorTest 的 wwwroot 中创建 app.js 文件，并在其中添加这些代码
var GLOBAL = {};
GLOBAL.DotNetReference = null;
function setDotnetReference(pDotNetReference) {
GLOBAL.DotNetReference = pDotNetReference;
}
window.addEventListener('resize', function () {
const sizeCategory = getScreenSizeCategory();
GLOBAL.DotNetReference.invokeMethodAsync( 'OnWindowResized');
});
创建 ResizeHello.razor 组件并放置在 BlazorTest.Client 中，并在 BlazorTest 的 App.razor 中使用它，并将这些代码添加到其中
@rendermode InteractiveWebAssembly
@code
{
[Inject]
private IJSRuntime JSRuntime { get; set; }
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
var lDotNetReference = DotNetObjectReference.Create(this);
await JSRuntime.InvokeVoidAsync("setDotnetReference", lDotNetReference);
}
await base.OnAfterRenderAsync(firstRender);
}
[JSInvokable]
public void OnWindowResized()
{
Console.WriteLine("Hello message");
}
}
每次调整窗口大小时，它都会记录 Hello 消息
评论