Skip to content

v-if in action bar produces invalid state #76

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
rigor789 opened this issue Nov 3, 2017 · 6 comments
Closed

v-if in action bar produces invalid state #76

rigor789 opened this issue Nov 3, 2017 · 6 comments

Comments

@rigor789
Copy link
Member

rigor789 commented Nov 3, 2017

Using the following markup:

<action-bar title="test">
  <search-bar v-if="selectedTab === 0"></search-bar>
  <label v-else-if="selectedTab === 1" text="notifications"/>
  <label v-else text="DMS">
</action-bar>

When switching tabs the first change changes the action bar content properly, and then the following error is displayed:

ERROR: [Vue warn]: Error in nextTick: "Error: View not added to this instance. View: SearchBar(6) CurrentParent: undefined ExpectedParent: ActionBar(5)"

The error itself is thrown in NativeScript core: https://github.com/NativeScript/NativeScript/blob/f7a3a36b9cdd47042ce145de2e94af6eea63bba1/tns-core-modules/ui/core/view-base/view-base.ts#L504

A sample app reproducing the issue: https://play.nativescript.org/?template=play-vue&id=7i9dwtjHdw0Xh9sm13u_0

@rigor789
Copy link
Member Author

Wrapping the conditionals in a <StackLayout> fixes the issue, but ideally we shouldn't need to do that.

Working example: https://play.nativescript.org/?template=play-vue&id=6lCJ0V24pwls6qjNxdE0

@kubino
Copy link

kubino commented Feb 27, 2018

@rigor789 your Working example doesn't work for me:

[Galaxy J5]: TypeError: Cannot read property 'getKeyedTemplates' of undefined
File: "file:///data/data/org.nativescript.preview/files/app/nativescript-vue/index.js, line: 2137, column: 6

@rigor789
Copy link
Member Author

That's due to the ListView not using the new syntax in the linked playground.

@kubino
Copy link

kubino commented Feb 28, 2018

I see , but even after the syntax change, should not the old examples still work - because they are linked to the older versions? Does it mean that future updates will break the examples again ? Sorry for asking like this, I am just evaluating the tools - and it's not clear for me - comparing to JSFiddle (where usually only browser can cause future incompatibility)

@rigor789
Copy link
Member Author

They should be, but I'm guessing they don't "save" unchanged files, meaning that it will use the latest version no matter what. This is just a wild guess, because I don't actually know the internals of the playground.

@nativescript-vue nativescript-vue locked as resolved and limited conversation to collaborators Jul 5, 2018
@nativescript-vue-bot
Copy link
Collaborator

We are locking this issue because it has been closed for more than 14 days.

If the issue comes up again please open a new issue with additional details.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Development

No branches or pull requests

3 participants