How to use vue components in nativescript-vue popups?

Question

I open the popup in some root component like this:

import parentt from "./parentt.vue";
.
.
.
this.$showModal(parentt, {
  fullscreen: true,
});

This is the content of parentt.vue:

<template>
  <StackLayout>
    <label text="parent" />
    <!-- <child /> -->
  </StackLayout>
</template>

<script>
  import child from "./child.vue";
  export default {
    components: [child],
  };
</script>

<style scoped>
</style>

This is the content of child.vue:

<template>
  <StackLayout>
    <label text="child" />
  </StackLayout>
</template>

<script>
  export default {};
</script>

<style scoped></style>

Whith <child /> commented out I get a popup with text parent in it.

with <child /> being there I get a white screen.

I'm using many components in different places in my code, it's only here in a popup that it doesn't work.

tony19 · Accepted Answer · 2022-07-15 22:32:24Z

2

You have wrong bracket in components object in parentt.vue. Components is an object, thus use braces instead of the square brackets.

So, the correct script section looks like in parentt.vue:

<script>
  import child from "./child.vue";
  export default {
    components: {
       child
    },
  };
</script>

I recommend for detailed informations the official vue documentation

edited Jul 15, 2022 at 22:32

tony19

140k23 gold badges281 silver badges354 bronze badges

answered Jul 22, 2019 at 11:34

robertkovacs

4653 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

yukashima huksay Over a year ago

I don't think the name really matters... the problem was with the bracket:( my heart is broken. It took 3 hours from me. Wouldn't I have gotten an error if I had used vue-debugger?

robertkovacs Over a year ago

You can use for these purpose the browser console or your command line tool.

yukashima huksay Over a year ago

I'm not using a browser. It's a nativescript app.

Collectives™ on Stack Overflow

How to use vue components in nativescript-vue popups?

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related