vue3挂载全局方法

// 创建一个 Vue 3 应用并挂载全局方法

// 引入 Vue
import { createApp } from 'vue';

// 定义一个全局方法
function globalMethod() {
  console.log('This is a global method');
}

// 创建 Vue 应用实例
const app = createApp({
  // 根组件
  template: '<div @click="callGlobalMethod">Click me</div>',
  methods: {
    callGlobalMethod() {
      this.$globalMethod(); // 调用全局方法
    }
  }
});

// 挂载全局方法到应用实例的 prototype 上
app.config.globalProperties.$globalMethod = globalMethod;

// 挂载应用到 DOM
app.mount('#app');

解释说明：

1. 引入 Vue：使用 createApp 函数创建一个新的 Vue 应用实例。
2. 定义全局方法：定义了一个名为 globalMethod 的函数，该函数会在控制台输出一条消息。
3. 创建 Vue 应用实例：创建了一个 Vue 应用实例，并在根组件中定义了一个点击事件处理方法 callGlobalMethod。
4. 挂载全局方法：通过 app.config.globalProperties 将 globalMethod 挂载到应用实例的原型链上，这样所有的组件都可以通过 this.$globalMethod 来调用这个方法。
5. 挂载应用到 DOM：最后将应用实例挂载到指定的 DOM 元素上（例如 #app）。