【问题标题】:Blazor Child Component EventCallBack not respondingBlazor 子组件 EventCallBack 没有响应
【发布时间】:2021-02-02 23:48:49
【问题描述】:

此处页面组件

@page "/student"
<h3>Student List</h3>
<h5>@StudentsList</h5>

<StudentDetail StudentName="Something New" ButtonClicked="@Save"></StudentDetail>

<h5>This is second</h5>
<h5>@SaveMessage</h5>


@code {
    public string StudentsList { get; set; }
    private string SaveMessage { get; set; }

    protected override async Task OnInitializedAsync()
    {
        StudentsList = "ASD DSA KDS CFA";
    }

    private void Save(MouseEventArgs e)
    {
        SaveMessage = "Operation Saved.";
    }
}

这是StudentDetail

<h3>Student Detail for @StudentName</h3>
<button class="btn btn-primary" @onClick="ButtonClicked">Click Me!</button>
@code {
    [Parameter]
    public string StudentName { get; set; }

    [Parameter]
    public EventCallback<MouseEventArgs> ButtonClicked { get; set; }

}

我在服务器端和客户端都试过这个。当我点击“点击我!”按钮,绝对没有任何反应。我做错了什么?

这些是进口产品

@using System.Net.Http
@using System.Net.Http.Json
@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
@using BlazorApp4
@using BlazorApp4.Shared

【问题讨论】:

    标签: c# components blazor blazor-server-side blazor-client-side


    【解决方案1】:

    学生详情:

    这是@onclick,而不是@onClick="ButtonClicked"中的@onClick

    当你点击"Click Me!"按钮时,你实际上是想触发Student组件中的“Save”方法。你就是这样做的:

    `@onclick="() => ButtonClicked.InvokeAsync()"`
    

    学生: 将ButtonClicked="@Save" 更改为ButtonClicked="Save"

    【讨论】:

    • 无效。甚至尝试调用异步方法,例如; @code { [Parameter] public string StudentName { get;放; } [参数] public EventCallback ButtonClicked { get;放; } 公共异步无效 ExecuteAsync(MouseEventArgs e) { 等待 ButtonClicked.InvokeAsync(e); } } 仍然不起作用..
    • 再一次:这是@onclick,
    • 不是@onClick。你看得到差别吗。不要使用 async void,使用 async Task
    猜你喜欢
    • 2020-05-06
    • 2021-11-04
    • 2021-08-25
    • 2021-03-18
    • 2021-01-30
    • 1970-01-01
    • 1970-01-01
    • 2021-01-26
    • 1970-01-01
    相关资源
    最近更新 更多