Messages, events between components?

Question

Hi everyone,.

my layout page (MainLayout.razor) contains navigation in header additionally component for login (right side of header) and finally language selection (last entry in header). The index is output in MainLayout via @Tomas Podoba .

Now I am looking for a simple way to trigger an event when the user selects another language, because the information on the index page should be displayed in the selected language.

I have found very many examples that solve this problem very well in the relationship Parent Child Components. I also found examples about Inject, but none of them I can use. The first way to use it (Parent Child) doesn't work, because here we have two components that are not in a direct relationship (both are on the MainLayout.razor page and don't know anything about each other).

With Injection I can define a common class and exchange data (for example I can get to the language selection without any problems), but it doesn't really help me, because I should be able to respond to events or if the visitor has chosen a different language, Index (which is located on MainLayout) should know about it, so that the information there are translated appropriately.

I have currently solved this in such a way that I perform a refresh of the complete page after language selection and I keep the data (specifically language selection) for the two components together. So the messages are updated after the refresh. But it would be much nicer if the language selection would do a "silent" refresh of all strings and messages in different components.

Does anyone have a suggestion on how to implement it?

Thanks in advance

Daniel

Answer 1

@perfect code - Darn sorry I posted the wrong article. I meant:
Implementing State Management In Blazor

Essentially we are creating an Event Handler that will allow other controls to subscribe to it, so that they will be notified when tracked values change. In addition, we are adding methods that can be consumed and invoked by other controls.

Answer 2

You may find this helpful:
Blazor Binding, Events and Parameters

Answer 3

Thanks ADefWebserver for your detailed answer, but that's exactly the Parent Childe solution I can't apply here.

Imagine that both the ToDoPage component and the ToDoComponent component are located next to each other on a third page (e.g. index.blazor). They are not parameters that can be passed from one component to another (as it is done here in your example via @ref_ahref ). Both components are on one page separately from each other, that's the problem!

Daniel

Answer 4

Great, it works! Thanks a lot ADefWebserver