时间戳

首页 > 解决方案 > Core 3.1 Blazor 应用程序中的 onclick 不起作用

asp.net-core - Core 3.1 Blazor 应用程序中的 onclick 不起作用

问题描述

我刚刚安装了 Visual Studio 2019（v16.4.3，立即更新到 16.4.4）。我的系统上有 VS2017，但没有 VS2019 的早期版本。

我创建了一个新的 Blazor 应用项目。它自动创建索引、计数器和其他页面。它将它创建为一个 .NET Core 3.1 应用程序（因为 3.1 现在与 VS2019 v16.4 及更高版本一起自动安装，显然）。

我真的在关注这个“开始”页面：

https://docs.microsoft.com/en-us/aspnet/core/blazor/get-started?view=aspnetcore-3.1&tabs=visual-studio

我运行应用程序时没有更改生成的内容。单击计数器页面上的按钮不会执行任何操作。我在“调试输出”窗口中看不到任何有任何关系的消息。

我做了一些搜索，发现了类似问题的报告，但解决方案似乎并不适用。

知道有什么问题吗？（当一个新生成的、未修改的项目不起作用时，这太烦人了！）

计数器页面的代码生成为：

@page "/counter"

<h1>Counter</h1>

<p>Current count: @currentCount</p>

<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>

@code {
    private int currentCount = 0;

    private void IncrementCount()
    {
        currentCount++;
    }
}

_Host.cshtml 是：

@page "/"
@namespace ToDoList.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>ToDoList</title>
    <base href="~/" />
    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
    <link href="css/site.css" rel="stylesheet" />
</head>
<body>
    <app>
        <component type="typeof(App)" render-mode="ServerPrerendered" />
    </app>

    <div id="blazor-error-ui">
        <environment include="Staging,Production">
            An error has occurred. This application may no longer respond until reloaded.
        </environment>
        <environment include="Development">
            An unhandled exception has occurred. See browser dev tools for details.
        </environment>
        <a href="" class="reload">Reload</a>
        <a class="dismiss"></a>
    </div>

    <script src="_framework/blazor.server.js"></script>
</body>
</html>

更新：

根据评论建议：

BlazorApp1.csproj 的全部内容：

<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>netcoreapp3.1</TargetFramework>
  </PropertyGroup>

</Project>

请注意，我关注的 Get Started 链接专门说要使用 .NET Core 3.1（vs 2.1）。它说可以选择更新到 3.2 预览版，但只有在我想做 Blazor WebAssembly 时才需要（我不这样做）。我更喜欢只在我的系统上发布代码，所以我不想更新到 3.2 预览版以获取应该与 3.1 一起使用的东西。

标签： asp.net-coreonclickblazor

解决方案

VS2019 默认在 Internet Explorer 中启动应用程序。

我将其更改为在 Edge 中启动它。它适用于边缘。

最终更新：

我让它在 IE11 中工作。为此：

我从这里下载了 Daddoon Blazor Polyfill 包：

https://github.com/Daddoon/Blazor.Polyfill

从下载的 zip 文件中，我将 Publish\Blazor.Polyfill.Publish\blazor.polyfill.min.js 复制到了我在项目文件夹的 wwwroot 子文件夹下创建的名为“js”的子文件夹中。即在 ToDoList\wwwroot 中，我创建了一个名为“js”的子文件夹，然后将 blazor.polyfill.min.js 文件复制到该子文件夹中。

然后，我编辑了文件_Host.cshtml。我在这里添加了第一行（在第二行之前，它已经存在，由 VS 和 Blazor Server 模板生成）：

<script src="js/blazor.polyfill.min.js"></script>
<script src="_framework/blazor.server.js"></script>

我找到了一堆说“使用 Polyfills”的东西，但我找不到任何说“这就是你实际这样做的方式”的东西。所以，希望这对其他人有帮助。另外，如果我以次优的方式做某事，希望有人会看到这一点并告诉我如何以更好的方式来做。

推荐阅读