vue3组件注册

在Vue 3中，组件的注册方式发生了变化。根据组件的使用方式，可以分为全局注册和局部注册。

1. 全局注册：

可以在应用的入口文件（例如main.js或main.ts）中使用app.component方法来全局注册组件。

import { createApp } from 'vue';
import App from './App.vue';
import MyComponent from './components/MyComponent.vue';
 
const app = createApp(App);
 
app.component('MyComponent', MyComponent);
 
app.mount('#app');

2. 局部注册：

在需要使用该组件的单文件组件中导入组件，然后在components选项中注册。

<template>
  <div>
    <MyComponent />
  </div>
</template>
 
<script>
import MyComponent from '@/components/MyComponent.vue';
 
export default {
  components: {
    MyComponent
  }
};
</script>

3. 使用<script setup>的局部注册：

在Vue 3中，可以使用<script setup>来避免写完整的<script>标签。局部注册的组件同样适用。

<template>
  <MyComponent />
</template>
 
<script setup>
import MyComponent from '@/components/MyComponent.vue';
</script>

以上是Vue 3中组件注册的基本方法。根据实际需求，选择合适的注册方式。