vue3全局组件

作者：我在坚强也需要有人疼发布日期:2026-01-03 浏览:28

// main.js

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');

解释说明：

导入模块：首先，我们从 vue 中导入 createApp 函数，并导入主应用 App.vue 和要注册为全局组件的 MyComponent.vue。
创建应用实例：使用 createApp(App) 创建一个 Vue 应用实例。
注册全局组件：通过 app.component('MyComponent', MyComponent) 方法将 MyComponent 注册为全局组件。这样在应用中的任何地方都可以直接使用 <MyComponent /> 标签来引用这个组件，而无需再单独导入和注册。
挂载应用：最后，使用 app.mount('#app') 将应用挂载到 DOM 中的指定元素上。

这样，MyComponent 就可以在整个应用中作为全局组件使用了。

上一篇：vue import from .和@的区别

下一篇：typescript vue