时间戳

首页 > 解决方案 > 如何在 nativescript-vue 弹出窗口中使用 vue 组件？

javascript - 如何在 nativescript-vue 弹出窗口中使用 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 />那里我得到一个白屏。

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

标签： javascriptvue.jsvuejs2nativescriptnativescript-vue

解决方案

你在组件对象中有错误的括号parentt.vue。组件是一个对象，因此使用大括号而不是方括号。

因此，正确的脚本部分如下所示parentt.vue：

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

我推荐vue 官方文档获取详细信息

推荐阅读