首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何从子组件向父组件传递事件更改

如何从子组件向父组件传递事件更改
EN

Stack Overflow用户
提问于 2019-10-04 05:24:15
回答 2查看 327关注 0票数 0

我试图跟随“捕获对元素的引用”,将更改从子组件传递到父组件,但它不起作用,url是https://docs.microsoft.com/en-us/aspnet/core/blazor/javascript-interop?view=aspnetcore-3.0#capture-references-to-elements

能帮我个忙吗?a)代码中有什么错误吗?b)在哪里可以找到"Console.WriteLine“信息,因为我在vs输出窗口中找不到它。

代码语言:javascript
复制
1. ParentComponent.razor

@page "/parentcomponent"
@using BlazorApp.Components

<h1>Parent Component</h1>

<p>ParentYear: @ParentYear</p>

<ChildComponent @ref="ChildComponent1" @bind-Year="ParentYear" />

@code {
    private int ParentYear = 1978;

    ChildComponent ChildComponent1 = new ChildComponent();

    protected override void OnInitialized()
    {
        ChildComponent1.YearChanged += ChildFiredEvent;
    }

    public void ChildFiredEvent(int _year)
    {
        ParentYear = _year;
        Console.WriteLine(ParentYear.ToString());
        StateHasChanged();
    }

}

2. Childcomponent.razor

<h2>Child Component</h2>

<p>ChildYear: @Year</p>

<button class="btn btn-primary" @onclick="ChangeTheYear">Change Year to 1986</button>

@code {
    [Parameter]
    public int Year { get; set; }

    [Parameter]
    public Action<int> YearChanged { get; set; }

    private void ChangeTheYear()
    {
        Year = 1986;
        YearChanged?.Invoke(Year);
    }
}
EN

回答 2

Stack Overflow用户

发布于 2019-10-04 20:28:48

在子组件中,YearChanged声明应如下所示:

代码语言:javascript
复制
public EventCallBack<int> YearChanged { get; set; }

然后像这样调用它:

代码语言:javascript
复制
await YearChanged.InvokeAsync(newValue);
票数 1
EN

Stack Overflow用户

发布于 2019-10-04 21:13:44

非常感谢,Samer和David。我相信我使用了之前的blazor方法。现在,它与@ref一起工作得很好。干杯!以下是代码。

代码语言:javascript
复制
@page "/parentcomponent"
@using BlazorApp.Components

<h1>Parent Component</h1>

<p>ParentYear: @ParentYear</p>

<ChildComponent @ref="ChildComponent1" @bind-Year="ParentYear" />

@code {
    private int ParentYear = 1978;

    ChildComponent ChildComponent1 = new ChildComponent();
}

<p>ChildYear: @Year</p>

<button class="btn btn-primary" @onclick="ChangeTheYear">Change Year to 1986</button>

@code {
    [Parameter]
    public int Year { get; set; }

    [Parameter]
    public Microsoft.AspNetCore.Components.EventCallback<int> YearChanged { get; set; }
    enter code here
    private void ChangeTheYear()
    {
        Year = 1986;
        YearChanged.InvokeAsync(Year);
    }
}
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/58227078

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档