ASP.NET Core Blazorでボタン押下時に任意のJavaScriptを実行する方法について説明します。
JavaScript呼び出し
JavaScriptを呼び出すには、IJSRuntime を依存注入し、そのインスタンス(以下の例では _JSRuntime)メソッドである InvokeAsync を使います。
InvokeAsync メソッドの第1引数に呼び出すJSの関数名、第2引数にJSの関数に渡す引数(複数あるときは配列)を指定します。
第1引数のJSの関数名には "インスタンス名.メソッド名"
の形式も指定可能です。この場合はJavaScript側では window.インスタンス名.メソッド名
が呼び出されます。
@page "/JavaScriptConfirm"
@rendermode InteractiveServer
@inject IJSRuntime _JSRuntime
<button @onclick="ScriptConfirm">確定</button>
<p>@Message</p>
@code
{
private string Message { get; set; } = "";
private async Task ScriptConfirm()
{
// JavaScriptで「confirm("実行します。よろしいですか?")」を実行する
var res = await _JSRuntime.InvokeAsync<bool>("confirm", "実行します。よろしいですか?");
if (res)
{
Message = "起動しました。";
}
else
{
Message = "キャンセルしました。";
}
}
}
以上です。