$navigateTo nested Frame does show nothing

[wendt88]

Version

2.0.2

Reproduction link

Playground

Platform and OS info

Android

Steps to reproduce

click at one of theses buttons in playground

What is expected?

that above opens one of the contents
1 -> Hello world text content
2 -> Image

What is actually happening?

Components get rendered (watch console),
but nothing gets shown
looking the elements on chrome in debug mode, there is only a Frame text:

[rigor789]

I can't see buttons in the linked playground, can you check if you linked the correct one?

As a side note, I'm not sure if nested frames are supported in NativeScript, can't find much info on that...

[wendt88]

Sorry, I updated now my link in the original post.
the only thing I could find on these was:
#213
and watching the code there is a frame option for the $navigateTo method.
looking to console the components gets initialized and also the history works

[wendt88]

Now I get it work by wrapping my content in a <Page>.
In my case I have a sidedrawer wich navigates the frame inside mainContent.
I navigate always to the same content passing various pageId's as a property.
Navigating works, but if I go back, no Vue-Lifecycle-Hook gets triggered, so from my base component (containing the sidedrawer) doesn't know on which page (pageId) the user is.
as a workaround I navigate normaly from basecomponent to same basecomponent passing the pageId, which I pass to his subcomponent (the content)
the only thing is, that so my basecomponent containing the sidedrawer gets rerendered every time

[rigor789]

Back navigation doesn't actually trigger any Vue lifecycle events, as the instance in the backstack is not destroyed. Instances in the backstack are only destroyed when using clearHistory: true or navigating from an entry with backstackVisible: false.

Can you share what you need the lifecycle events for? Can you use navigated and navigatedBack events on the <Frame> instead?

I'm not sure if we have these documented, but you can see when they are emitted here:

nativescript-vue/platform/nativescript/runtime/components/frame.js

Lines 109 to 116 in cfbf83d

	this.$emit('navigated', entry)
	})
	const handler = args => {
	if (args.isBackNavigation) {
	page.off('navigatedFrom', handler)
	this.$emit('navigatedBack', entry)

[pdipax]

Your code it's ok but you must add the page tag on your pages Content1 and Content2

Playground

<Page actionBarHidden="true">
...
</Page>

[wendt88]

the navigated and navigatedBack events solved my problem... there I have access to the props, thx!

[slushnys]

May I ask why you need navigation within the same component (that is if I understood the problem correctly)? You were saying you use this as a workaround, maybe vuex would be of a value for you here?