Lightning Components and propagation to children

Question

I'm building/modifying a tool using lightning components which houses (dynamically-created) input components in a larger wrapper component. Currently, the inputs correctly send events to the wrapper (to update a master map of values), but because some inputs are linked in different ways, I then need to send an event (linkEvent) from the wrapper to reach and update other inputs.

EDIT: I should mention, there are multiple nested 'levels' between the Wrapper and these Inputs, and some Inputs themselves contain sub-inputs which need to communicate in the same way.

Here's some code to illustrate the issue:

WrapperComp:

<aura:registerEvent name="linkEvent" type="c:MyLinkEvent" />
//
buildComponent:function(component, options) {
    $A.createComponent('InputComp', options, function(el) {
        var body = component.get('v.body');
        if (options['link']) {
            el.addEventHandler('linkEvent', el.getReference('c.handler'));
        }
        body.push(el);
        component.set('v.body', body);
    });
},
handleComponentEvent:function(component, event, helper) {
    var val = event.getParam('payload');
    var link = event.getParam('link');
    // Do some things
    var ev = component.getEvent('linkEvent');
    ev.setParams({'payload':val,'link':link});
    ev.fire();
}

InputComp:

<aura:registerEvent name="linkEvent" type="c:MyLinkEvent" />
//
handler:function(component, event) {
    console.log('This is not being logged');
    var eLink = event.getParam('link');
    var cLink = component.get('v.link');
    if (eLink==cLink) {
        // Do some things
    }
}

My inputs are reaching the wrapper without a problem, I just need to send information back to children after. My two main questions are: Can this be accomplished with Component events? And if so, do I need to register the event in the parent (because that's where I call addEventHandler()), or in the child? Or both?

Answer 1

Typically when you are talking about top down approach you tend to use attributes or aura methods.

My suggestion for your use case would be using application event where your hierarchies are very complex, and use the application event only when absolutely necessary. Application events are great for supporting business logic events as they are quite flexible: They do not impose a particular architecture.(This is key for your use case considering performance) This is ideal when building components that are exposed in the Lightning App Builder. However, bear in mind that this flexibility comes at the expense of performance in certain use cases due to the event broadcast.

In every other scenario where u are trying to reach from bottom up use components events.Component events are “clones” of standard DOM events (mouse clicks, key press, and so on). Just like their DOM counterparts, they propagate up in the component hierarchy via a bubbling mechanism and can be stopped en route to the application root component.

Question 1: NO

If by using multiple application event your performance is taking a hit, I would say its time for you to rethink your design.

Below is a beautiful blog about passing data around lightning components.

Lightning Inter-Component Communication Patterns

Answer 2

According to this article, it seems the answer is yes but only if you specify a capture phase.

I haven't seen this pattern too often, as I believe that either attributes or methods are more commonly used to communicate down in hierarchy.