Consider below component chain in Aura:
<c:parent> <c:child> <c:grandChild>
When grandChild fires event, we can get hold of the source component by using event.getSource().
So, if I have an aura:method in grandChild, then I can invoke and pass some data to grandChild by using below in parent JS:
myMethod is aura:method in grandChild
Now lets consider same chain in LWC:
<c-parent> <c-child> <c-grand-child>
Here, when grand-child fires event, and when we are handling that event in parent, event.target will point to child and not grand-child. This is because of reparenting of event concept in web components.
Use case: child is a reusable component which has many levels of child components. Each of child component triggers different events on init. Other developers can pass the data to grandChild based on event. Now, the child component is a very complicated component which has many different views, so the design of this cannot be changed. We are facing the problem when migrating this component to LWC as we are unable to pass the data using some simple method. I know of other principles like redux, but would like to know if any simpler methods exist.