vue3和vue2的创建全局方法

以下是Vue2和Vue3创建全局方法的两种方式：

Vue2创建全局方法：
1.在main.js中导入Vue和组件

import Vue from 'vue'
import header from "@/components/header.vue"

2.使用Vue.component()方法注册组件

Vue.component("header", header)

Vue3创建全局方法：
1.在main.js中导入createApp和组件

import { createApp } from 'vue'
import header from "@/components/header.vue"

2.使用createApp().component()方法注册组件

const app = createApp({})
app.component("header", header)

相关问题

vue3怎么像vue2取全局

在Vue3中，可以使用`app.config.globalProperties`来获取全局属性。例如，如果要获取全局变量`$http`，可以使用以下代码：

const app = createApp({...})
app.config.globalProperties.$http = axios

然后在组件中就可以直接使用`this.$http`来访问全局变量了。

vue局部组件创建和全局组件创建

在 Vue 中，我们可以通过两种方式来创建组件，即局部组件和全局组件。

局部组件创建：
局部组件是在某个组件内部定义的组件，在该组件内部可以直接使用，但在其他组件中是不可用的。

示例代码：

<template>
  <div>
    <my-component></my-component>
  </div>
</template>

<script>
import MyComponent from './MyComponent.vue';

export default {
  name: 'MyParentComponent',
  components: {
    'my-component': MyComponent
  }
}
</script>

在这个示例中，我们在 `MyParentComponent` 组件中定义了一个名为 `MyComponent` 的局部组件，并在模板中使用了它。

全局组件创建：
全局组件可以在任何组件中使用，通常在 `main.js` 或 `App.vue` 中定义。

示例代码：

// main.js
import Vue from 'vue';
import MyComponent from './MyComponent.vue';

Vue.component('my-component', MyComponent);

在这个示例中，我们在 `main.js` 中定义了一个名为 `MyComponent` 的全局组件，并使用 `Vue.component` 方法将其注册到 Vue 中。此时，在任何组件中都可以使用 `<my-component></my-component>` 标签来使用这个组件。

需要注意的是，全局组件会被注册到全局 Vue 实例中，因此会增加应用的整体大小，而局部组件则只会在需要使用时才被加载，因此更加高效。