Vue3中组件注册

全局注册

全局注册的组件可以在任何新创建的Vue应用实例的模板中使用。

在man.js中

import { createApp } from 'vue'
import MyComponent from './MyComponent.vue'

// 全局注册组件
const app = createApp({});
app.component('my-component-name', MyComponent);

app.mount('#app');

局部注册

局部注册的组件只能在注册它的父组件的模板中使用。这适用于那些只在特定父组件中使用的子组件。

在使用 <script setup> 的单文件组件中，导入的组件可以直接在模板中使用，无需注册：

<script setup>
import ComponentA from './ComponentA.vue'
</script>

<template>
  <ComponentA />
</template>

如果没有使用 <script setup>，则需要使用 components 选项来显式注册：

import ComponentA from './ComponentA.js'

export default {
  components: {
    ComponentA
  },
  setup() {
    // ...
  }
}