如何知道何时触发EventCallback? [英] How to know when EventCallback has been fired?

问题描述

我正在对剃刀组件进行一些测试，但是在将属性从子组件更新为祖父母组件时遇到问题.

I'm doing some testing with razor components but I have an issue to update a property from the child component to the grand-parent component.

当子组件更新属性时，我正在使用EventCallback更新我的父组件.它适用于具有两个级别(ParentComponent/ChildComponent)的体系结构，但是不适用于具有三个级别(GrandParentComponent/ParentComponent/ChildComponent)的体系.

I'm using EventCallback to update my parent component when the child component updates a property. It works well for architecture with two levels (ParentComponent/ChildComponent) however, it doesn't work with three levels (GrandParentComponent/ParentComponent/ChildComponent).

让我们以包含三个部分A，B和C的示例为例.

Let's take an example with three components A, B and C.

- A (GrandParentComponent)
-- B (ParentComponent)
--- C (ChildComponent)

• 更新B会触发EventCallback来更新A
• 更新C会触发EventCallback来更新B，但是在此阶段B不会在更新后触发EventCallback，因此A组件仍未更新.

您如何知道某个组件是否已被EventCallback更新.

How can you know if a component has been updated by an EventCallback.

我想知道，因此当从C触发EventCallback时，可以从B触发EventCallback.是否有意义? :D

I would like to know that so I can trigger EventCallback from B when EventCallback from C has been fired. Does it make sense? :D

推荐答案

如何知道何时触发EventCallback?

How to know when EventCallback has been fired?

定义一个事件委托，您可以在触发EventCallback时触发该委托...只是开个玩笑.

Define a an event delegate that you can trigger when the EventCallback is fired... just jocking.

您可以通过多种方式进行操作.这是一个:

You can do that in various ways. Here's one:

<ComponentB ComponentBEvent="EventCallback.Factory.Create<string>(this, 
          mymethod)"></ComponentB>
<p>Message from Component A @message</p>

@code {
    private string message;

    private Task mymethod(string str)
   {
       message = str;
       return  Task.CompletedTask;
   }
}

ComponentB.razor

<ComponentC ComponentCEvent="EventCallback.Factory.Create<string>(this, 
                                                     mymethod)"></ComponentC>

<p>Message from Component B @message</p>

@code {
    string myvalue;
    [Parameter]
    public EventCallback<string> ComponentBEvent { get; set; }

    private string message;

    private async Task mymethod(string str)
    {
         message = str;

        if(ComponentBEvent.HasDelegate)
        {
           await ComponentBEvent.InvokeAsync(str);
        }
    }
 }

ComponentC.razor

<input type="text" value="@myvalue" @oninput="@((args) => { myvalue = 
   args.Value.ToString(); ComponentCEvent.InvokeAsync(args.Value.ToString()); 
})" />


<p>Message from Component C @myvalue</p>

@code {
     string myvalue;
     [Parameter]
     public EventCallback<string> ComponentCEvent { get; set; }
}

用法

<ComponentA />

注意:您可以使用通告程序服务来实现此行为，该服务采用状态模式.此服务控制对象的状态，更新，删除等，并定义在操作发生时触发的事件，例如，在组件A中添加了雇员对象，在这种情况下，通知程序服务会通知所有相关方(订阅组件) ).

Note: You may implement this behavior using a notifier service, which employ the state pattern. This service control the state of objects, update, delete, etc., and define events that are fired when an action occurs, say, an employee object was added in component A, in which case the notifier service notifies all interested parties (subscribing components) of this fact.

希望这对您有帮助...

Hope this helps...

这篇关于如何知道何时触发EventCallback?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！