C# - Использование компонентов Razor на странице Razor - событие @onclick не работает - PullRequest
1 голос
/ 16 апреля 2020

У меня есть «Веб-проект Razor Page», и я добавил свой компонент, как описано здесь: https://www.mikesdotnetting.com/article/338/using-razor-components-in-a-razor-page

После этого я собрал и использовал мой личный компонент. Это корректно отображается, но после добавления события @onclick в тег, кажется, это работает неправильно (событие не сработало)

Теоретически Я сделал все правильные шаги, и я ' мы уже проверили решение, но безуспешно:

  1. в моем файле startup.cs:

в ConfigureServices: services.AddServerSideBlazor ();

в Configure:

app.UseEndpoints(endpoints =>
            {
                endpoints.MapRazorPages();
                endpoints.MapBlazorHub();   
                endpoints.MapFallbackToPage("/_Host"); 
            });
[+]: папка компонентов [+]: _Imports.razor внутри папки моих компонентов
@using System.Net.Http
@using Microsoft.AspNetCore.Authorization
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.JSInterop
[+]: в моем _Layout.cs html (в конце Body TAG, после других скриптов):
<script src="_framework/blazor.server.js"></script>
[+]: App.razor в root проекта:
@using Microsoft.AspNetCore.Components.Routing

<Router AppAssembly="typeof(Program).Assembly">
    <Found Context="routeData">
        <RouteView RouteData="routeData" />
    </Found>
    <NotFound>
        <div class="alert alert-primary" role="alert">         
            <h1>Page Not Found</h1>
            <p>Sorry, but there's nothing here!</p>            
        </div>
    </NotFound>
</Router>

Теперь мой компонент бритвы (внутри папки Components):

image

с относительной составляющей базы:

using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web;
using System;
using System.Collections.Generic; 

namespace myAppWeb.Components
{
    public class LateralMenuComponent : ComponentBase
    {        
      [Parameter] public bool IsAuthenticate { get; set; }>           
      [Parameter] public List<MenuItem> MenuItems { get; set; }>     
      [Parameter] public short BadgeAlert { get; set; } = 3; // 3 => Draft, TO_DO!


      // [/!\] - This don't work!
        public void UpdateHeading(MouseEventArgs e)
        {
            Console.WriteLine(e);        
        }

    }
}

Можете ли вы помочь мне понять, что я делаю неправильно в моей среде? Заранее спасибо!

РЕДАКТИРОВАТЬ

Как правильно предположил Венковский в приведенном ниже комментарии, проблема заключалась в том, что я использовал stati c рендеринг поэтому в этом случае не может быть щелчков - я знаю, что это тривиальная проблема ...

1 Ответ

1 голос
/ 16 апреля 2020

Вы должны передать @onclick:preventDefault

<a href="" @onclick="@SomeAction" @onclick:preventDefault />

Рабочий пример для blazorfiddle .

...