blazor 组件中的 JS

Question

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

组件功能：

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

Javascript互操作：

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");
     }
}

把下面的脚本标签下方<script src="_framework/blazor.server.js"></script>的在_Host.cshtml文件中，就像这样：

@page "/"

<button @onclick="MessageBox">Show Message</button>

@code
{
    [Inject] IJSRuntime JSRuntime { get; set; }
    protected async Task MessageBox()
    {
       await JSRuntime.InvokeVoidAsync("exampleJsFunctions.ShowMsg", 
                                                    "Hello Blazor");
     }
}