【问题标题】:onclick in Core 3.1 Blazor app doesn't workCore 3.1 Blazor 应用程序中的 onclick 不起作用
【发布时间】:2020-05-23 01:06:31
【问题描述】:

我刚刚安装了 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>

更新:

根据评论建议:

  • 我重新启动了我的电脑
  • 直接进入VS2019并创建了一个新项目。选定的 Blazor 应用程序。接受所有默认值。因此,最终得到了一个名为 BlazorApp1 的项目。
  • 按 F5 启动它。结果相同。单击“单击我”按钮,计数器不会执行任何操作。

BlazorApp1.csproj 的全部内容:

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

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

</Project>

请注意,我关注的“入门”链接明确表示要使用 .NET Core 3.1(与 2.1 相比)。它说可以选择更新到 3.2 预览版,但只有当我想做 Blazor WebAssembly(我不这样做)时才需要这样做。我更喜欢只在我的系统上发布代码,所以我不想更新到 3.2 预览版以获得应该与 3.1 一起使用的东西。

【问题讨论】:

  • 检查 Web 浏览器控制台是否有错误消息。还可以更改 VS 中的输出窗口以显示来自 IIS 的项目调试或更改为使用 Kestrel 运行,以便查看输出。
  • Blazor 应用程序应以netstandard2.1 框架为目标,但 VS Blazor 模板可能已过时。你检查了框架目标吗?用dotnet new -i Microsoft.AspNetCore.Blazor.Templates::3.2.0-preview1.20073.1更新donet模板
  • @HenkHolterman,完成。帖子已更新。
  • @MisterMagoo 我还检查了 Web 服务器输出窗口。没有什么值得注意的。
  • @aguafrommars 我不确定您为什么说该应用程序应针对 netstandard2.1。另外,重点是,这是一个全新的项目,从头开始生成。完全没有被我修改。如果它生成 3.1 的目标,在我看来它应该可以工作。

标签: asp.net-core onclick blazor


【解决方案1】:

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

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

最终更新:

我让它在 IE11 中工作。这样做:

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

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

从下载的 zip 文件中,我将 Publish\Blazor.Polyfill.Publish\blazor.polyfill.min.js 复制到我在项目文件夹的 wwwroot 子文件夹下创建的名为“js”的子文件夹中。 IE。在 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”的东西,但我找不到任何说“这就是你实际这样做的方式”的东西。所以,希望这对其他人有帮助。另外,如果我以次优的方式做某事,希望有人会看到这一点并告诉我如何以更好的方式来做。

【讨论】:

【解决方案2】:

我遇到了同样的问题

要解决它,请转到您项目的 Properties >> Debug >> 取消选中 Enable SSL。然后通过单击例如运行您的项目。 IIS Express.

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-02-19
    • 2020-08-19
    • 1970-01-01
    • 2021-07-31
    • 2021-02-10
    • 1970-01-01
    • 2020-05-30
    • 1970-01-01
    相关资源
    最近更新 更多