yukashima huksay
yukashima huksay

Reputation: 6238

Open modal within modal in nativescript

When I try to open a modal while I'm already in another modal. I get an error saying:

ViewHierarchy: parent is already presenting view controller close the current modal page before showing another one!

Here is a playground sample, How can I have one modal within another?

To Reproduce

Expected behavior

You should see a new popup open.

My Env

$ tns info
✔ Getting NativeScript components versions information...
✔ Component nativescript has 6.5.0 version and is up to date.
✔ Component tns-core-modules has 6.5.0 version and is up to date.
✔ Component tns-android has 6.5.0 version and is up to date.
✔ Component tns-ios has 6.5.0 version and is up to date.

Upvotes: 1

Views: 1624

Answers (2)

miker
miker

Reputation: 101

The nativescript-vue documentation isn't clear on how to use nested modals, since it was fixed after @yukashima-huksay's post. But there is an example on github that demonstrates its use.

A secondary modal can be opened using the target option, which can target the current view (with this) or an element (i.e. this.$refs[<some element>]).

// this
this.$showModal(SecondaryModal, { target: this });

// $refs
this.$showModal(SecondaryModal, { target: this.$refs['myView'] });

Upvotes: 2

Manoj
Manoj

Reputation: 21908

This seems to be an issue with present version of NativeScript-Vue (as of today, v2.5.0). It tries to use the same parent controller every time you try to create modal, using the first modal as parent for second modal will solve the issue. But there is no workaround, either you will have to handle modals completely yourself or do a patch on the nativescript-vue package's source code. Otherwise, you may use v2.3.0 which solves this particular issue (but I'm not sure what are other benefits you have on v2.5.0 you might want to check the change logs).

I would suggest you to raise an issue on Github repo with your Playground sample and link to this SO post, hopefully they fix it in next version.

Upvotes: 1

Related Questions