文檔連接:在 ASP.NET Core Blazor 中從 .NET 方法調用 JavaScript 函數 | Microsoft Docs
Blazor 在標準?JavaScript 模塊（ECMAScript 規范）中啟用 JavaScript (JS) 隔離。
JS 隔離具有以下優勢：
導入的 JS 不再污染全局命名空間。
庫和組件的使用者不需要導入相關的 JS。
例如，以下 JS 模塊導出用于顯示瀏覽器窗口提示的 JS 函數。 將以下 JS 代碼置于外部 JS 文件中。
wwwroot/scripts.js:
JavaScript復制
exportfunctionshowPrompt(message){returnprompt(message,'Type anything here');}
將前面的 JS 模塊作為?wwwroot?文件夾中的靜態 Web 資產添加到應用或類庫中，然后通過調用?IJSRuntime?實例上的?InvokeAsync?將該模塊導入 .NET 代碼。
IJSRuntime?將模塊作為?IJSObjectReference?導入，它表示對 .NET 代碼中 JS 對象的引用。 使用?IJSObjectReference?調用從模塊導出的 JS 函數。
Pages/CallJsExample6.razor:
razor復制
@page "/call-js-example-6"@implements IAsyncDisposable@inject IJSRuntime JS
Call JS Example 6
Trigger browser window prompt
@result
@code {privateIJSObjectReference module;privatestringresult;protectedoverrideasyncTaskOnAfterRenderAsync(boolfirstRender){? ? ? ? if (firstRender)? ? ? ? {module = await JS.InvokeAsync("import","./scripts.js");}? ? }privateasyncTaskTriggerPrompt(){? ? ? ? result = await Prompt("Provide some text");? ? }publicasyncValueTaskPrompt(stringmessage){return await module.InvokeAsync("showPrompt", message);}asyncValueTask IAsyncDisposable.DisposeAsync(){? ? ? ? if (module is not null)? ? ? ? {? ? ? ? ? ? await module.DisposeAsync();? ? ? ? }? ? }}
在上面的示例中：
按照約定，import?標識符是專門用于導入 JS 模塊的特殊標識符。
使用穩定的靜態 Web 資產路徑?./{SCRIPT PATH AND FILENAME (.js)}?指定該模塊的外部 JS 文件，其中：
若要創建 JS 文件的正確靜態資產路徑，需要當前目錄 (./) 的路徑段。
{SCRIPT PATH AND FILENAME (.js)}?占位符是?wwwroot?下的路徑和文件名。
動態導入模塊需要網絡請求，因此只能通過調用?InvokeAsync?來異步實現。
IJSInProcessObjectReference?表示對某個 JS 對象的引用，該對象的函數可以同步進行調用。
?備注
當外部 JS 文件由?Razor 類庫提供時，使用其穩定的靜態 Web 資產路徑?./_content/{PACKAGE ID}/{SCRIPT PATH AND FILENAME (.js)}?指定模塊的 JS 文件：
若要創建 JS 文件的正確靜態資產路徑，需要當前目錄 (./) 的路徑段。
{PACKAGE ID}?占位符是庫的包 ID。 如果項目文件中沒有指定?<PackageId>，則包 ID 默認為項目的程序集名稱。 在下面的示例中，庫的程序集名稱為?ComponentLibrary，并且庫的項目文件未指定?<PackageId>。
{SCRIPT PATH AND FILENAME (.js)}?占位符是?wwwroot?下的路徑和文件名。 在以下實例中，外部 JS 文件 (script.js) 置于類庫的?wwwroot?文件夾中。
C#復制
varmodule =awaitjs.InvokeAsync("import","./_content/ComponentLibrary/scripts.js");
有關詳細信息，請參閱?使用 Razor 類庫中的 ASP.NET Core Razor 組件。
