如何在nativescript-vue弹出窗口中使用vue组件?

时间:2019-07-22 10:47:31

标签: javascript vue.js vuejs2 nativescript nativescript-vue

我在某些根组件中打开弹出窗口,如下所示:

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

这是parentt.vue的内容:

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

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

<style scoped>
</style>

这是child.vue的内容:

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

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

<style scoped></style>

<child />注释掉后,弹出一个带有文本父项的弹出窗口。

<child />在那,我得到了白屏。

我在代码的不同位置使用了许多组件,仅在弹出窗口中它不起作用。

1 个答案:

答案 0 :(得分:1)

parentt.vue中的组件对象中您使用了错误的括号。组件是一个对象,因此请使用花括号代替方括号。

因此,正确的脚本部分类似于parentt.vue

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

我建议您详细了解official vue documentation