web-dev-qa-db-fra.com

Événement Blazor onclick non déclenché

J'essaie d'implémenter un événement onclick simple comme cet exemple: https://blazorfiddle.com/s/counter mais ne fonctionne pas dans ma solution. L'événement n'est déclenché qu'à l'exécution de la page Web pour des raisons inconnues.

La page HTML avec le composant blazor est bien visible mais quand je clique sur le bouton, rien ne se passe.

Je suis sur VS 2019 .Net Core 3.0. Projet ASP.NET MVC

Fichier 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?}");
        });
    }

Le bouton dans le navigateur:

<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>

Erreur dans le navigateur:

Bug dans le navigateur

onclickblazor
5
micsp24

Dans mon cas, j'ai ajouté StaticFileOptions dans Startup.cs comme ceci (utilisé ce code dans mon projet 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}";
   }
});

Puis retourné à

 app.UseStaticFiles();

et ça a commencé à marcher

1
DreamEvil

Je viens de remarquer que j'intègre cela dans une application MVC. Vous n'avez pas la balise de script pour blazor.server.js dans l'index.cshtml dans vous ajoutez

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

au bas de la page index.cshtml, c'est ce qui relie le signal au serveur, ce qui est nécessaire pour le côté serveur.

Voir Scott Hanselman fait exactement ce que vous essayez de faire.

0
David Masterson

Ça devrait être <button @onclick=IncrementCount

0
Peter Morris

J'ai eu le même problème. Le problème était en cours d'exécution de l'application dans Internet Explorer.

OnClick a bien fonctionné lorsque j'ai exécuté l'application dans Edge.

0
StuartV