blazor组件中的JS

Question

我正试图在Blazor组件中创建一条警报消息。我不知道该怎么做。我正在运行ASP.NET Core 3.1 Blazor服务器端。以下是我尝试过的

组件功能：

private async Task ShowAlert()
{
await JSRuntime.InvokeAsync<object>("ShowMsg");
}

Javascript Interop:

function ShowMsg() {
success = "Success!";
return success; 
}

文件host.cshtml:

<script src="~/BlazorInterop.js"></script>

Answer 1

@page "/"
<button @onclick="MessageBox">Show Message</button>
@code
{
[Inject] IJSRuntime JSRuntime { get; set; }
protected async Task MessageBox()
{
await JSRuntime.InvokeVoidAsync("exampleJsFunctions.ShowMsg", 
"Hello Blazor");
}
}

在_Host.cshtml文件的<script src="_framework/blazor.server.js"></script>下面放置以下脚本标记，如下所示：

<script src="_framework/blazor.server.js"></script>
<script>
window.exampleJsFunctions =
{
ShowMsg: function (message) {
window.alert(message);
}
};
</script>