web-dev-qa-db-ja.com

Blazor onclickイベントがトリガーされない

次のサンプルのような単純なonclickイベントを実装しようとします： https://blazorfiddle.com/s/counter が、私のソリューションでは機能しません。イベントは、不明な理由でWebページの実行時にのみトリガーされます。

ブレザーコンポーネントを含むHTMLページはよく表示されますが、ボタンをクリックしても何も起こりません。

私はVS 2019 .Net Core 3.0を使用しています。 ASP.NET MVCプロジェクト

Counter.razorファイル：

@using Microsoft.AspNetCore.Components


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

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


    @code {
        int currentCount = 0;

        private async Task IncrementCount()
        {
            await Task.Run(() => currentCount++);
        }
    }

Index.cshtml：

@using WebApplication2.Views.Components

@{
    ViewData["Title"] = "Home Page";
}


<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://docs.Microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>

</div>


@(await Html.RenderComponentAsync<Counter>(RenderMode.Server, new { }))

startup.cs：

    public void ConfigureServices(IServiceCollection services)
    {
        services.AddControllersWithViews();

        services.AddHttpClient();
        services.AddRazorPages();
        services.AddServerSideBlazor();
        services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_3_0);

    }

   public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        else
        {
            app.UseExceptionHandler("/Home/Error");
            // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
            app.UseHsts();
        }
        app.UseHttpsRedirection();
        app.UseStaticFiles();

        app.UseRouting();

        app.UseAuthorization();

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapRazorPages();
            endpoints.MapBlazorHub();
            endpoints.MapControllerRoute(
                name: "default",
                pattern: "{controller=Home}/{action=Index}/{id?}");
        });
    }

ブラウザのボタン：

<button class="btn btn-primary" onclick="System.Runtime.CompilerServices.AsyncTaskMethodBuilder`1+AsyncStateMachineBox`1[System.Threading.Tasks.VoidTaskResult,WebApplication2.Views.Components.Counter+<IncrementCount>d__2];">Click me</button>

ブラウザのエラー：

ブラウザのバグ

onclickblazor
5
micsp24

私の場合、Startup.csにStaticFileOptionsを次のように追加しました（mvc asp.coreプロジェクトでこのコードを使用しました）

app.UseStaticFiles(new StaticFileOptions()
{
   OnPrepareResponse = ctx =>
   {
       const int duration = 60 * 60 * 24;
       ctx.Context.Response.Headers[HeaderNames.CacheControl] = $"public,max-age={duration}";
   }
});

その後に戻った

 app.UseStaticFiles();

そしてそれは働き始めました

1
DreamEvil

これをMVCアプリケーションに埋め込んでいることに気づきました。追加するindex.cshtmlにblazor.server.jsへのスクリプトタグがありません

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

index.cshtmlページの下部で、これは信号をサーバーに配線するもので、サーバー側に必要です。

参照 スコット・ハンセルマンがあなたがやろうとしていることを正確に行っている。

0
David Masterson

そのはず <button @onclick=IncrementCount

0
Peter Morris

私も同じ問題を抱えていました。問題は、アプリをInternet Explorerで実行することでした。

Edgeでアプリを実行したところ、OnClickは問題なく動作しました。

0
StuartV