Question

我在 .js 文件中有以下 JavaScript 代码：

export function testAlert() {
  alert('Testing Blazor');
}

当我将它添加到我的 Razor 组件时，我收到一个警告：

我按照建议将以下内容添加到 index.html 文件中：

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <title>BlazorTest</title>
  <base href="/" />
  <link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />
  <link href="css/app.css" rel="stylesheet" />
  <link href="BlazorTest.styles.css" rel="stylesheet" />
  <script type="text/javascript" src="scripts/testing.js"></script>
</head>

相应地修改了组件：

@inject IJSRuntime JS

protected override async Task OnAfterRenderAsync(bool firstRender)
{
  base.OnAfterRenderAsync(firstRender);
  await JS.InvokeAsync<string>("testAlert");
}

当我加载页面时，出现以下错误：

<块引用>

未处理的异常呈现组件：找不到“testAlert”（“testAlert”未定义）。

我查看了页面的来源，它是这样的：

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <title>BlazorTest</title>
  <base href="/" />
  <link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />
  <link href="css/app.css" rel="stylesheet" />
  <link href="BlazorTest.styles.css" rel="stylesheet" />
</head>

使用加载的脚本修改 index.html 发生了什么变化？

Answer 1

有时 index.html 文件会被浏览器缓存。这里可能就是这种情况。

通常使用 Ctrl-F5 强制刷新会强制下载新编辑的文件。

如何在 Blazor 客户端 index.html 中加载 JavaScript 文件

1 个答案: