Question

我尝试在其他组件（App.vue）中使用vue组件（Global.vue），但是

无法安装组件：模板或渲染函数未定义

错误。

Global.vue ：

NSInvalidatedAllObjectsKey

App.vue ：

<template>
  <div class="global-view">
    <p>Global </p>
  </div>
</template>

<script>
export default {
  name: 'global'
}
</script>

main.js ：

<template>
  <div id="app">
    <global></global>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  name: 'app'
}
</script>

Answer 1

您需要在组件文件中导入要使用它的组件。

`从＆＃39; ./ components / Global＆＃39;

导入全局

从那里你需要在你的组件选项中添加一个新的键，它将＆＃34;注册＆＃34;组件。

以下是您希望应用组件的外观。

<template>
  <div id="app">
    <global></global>
    <router-view></router-view>
  </div>
</template>

<script>
import Global from './components/Global

export default {
  name: 'app'
  components: {
    'global': Global,
  }
}
</script>

<global></global>应该能够在此时呈现。

Answer 2

我使用import而不是require（在main.js中），它适用于我：

import Global from './components/Global.vue
Vue.component('global', Global)`

在其他vue组件文件中使用vue组件

2 个答案: