What’s the way to add a footer to the RouterLayout (MainLayout). I tried using AfterNavigationObserver but that’s always called when navigating so the footer get’s added multiple times.
When it doesn’t change in the constructor.
When the footer can change depending on the view, using observer is a good pattern. In there you can check if the footer was already added (store it in a class variable)
The constructor doesn’t work I guess because the footer would be added before the content of the View inheriting from the MainLayout and thus is between the header and the view content. I’ve overriden the removeRouterLayoutContent
and call the removeFromParent
on the footer and add it in the after navigation event. Thanks for your input
You can specify where the view is rendered so you could for example add a Header, Main and Footer inside your main layout and replace the content of Main on Navigation
How would I achieve that?
The RouterLayout interface has two methods you can override and do the add/removal on another element https://vaadin.com/api/platform/23.2.6/com/vaadin/flow/router/RouterLayout.html
The AppLayout does it for example https://github.com/vaadin/flow-components/blob/482827ca4a2a44f40dfda51185b00cb91bc749bd/vaadin-app-layout-flow-parent/vaadin-app-layout-flow/src/main/java/com/vaadin/flow/component/applayout/AppLayout.java#L307
So I would add a header, a “dummy div” as a placeholder, a footer?
And override showRouterLayoutContent
where I replace the “dummy div” with the actual content?
Correct even tho I would recommend to use the Main component from the html components package for accessibility
You would add the content into the dummy div instead of replacing it
Instead of the header tag?
Oh alright
Dummy div = Main
Seems to work Thanks
Can you give an example of code for this ?
thx