如何在 vue 的任何文件下都可以调用某个方法, 如 this.message()

在 vue 项目中 src 文件夹下创建 utils 文件夹 ( 这个文件夹是专门用来存放全局方法的 ) 在这个文件夹下创建 Methods.js 文件

 

 在这个文件写你需要的方法.  如下:

export function message() {
  alert('111')
}

 

然后再 main.js 文件下全局挂载(这个操作就叫全局挂载, 你就可以在 vue 任何地方去 this.message() 方法)

/* 引入指定的方法名 */
import { message } from '@/utils/Methods'

/* 挂载 */
Vue.prototype.message = message

 

然后就可以直接使用

 

<template>
  <div>
    <h2>消息弹出框</h2>
    <button @click="open">打开</button>
  </div>
</template>

<script>
export default {
  methods: {
    open() {
      this.message()
    }
  }
}
</script>

 

posted @ 2022-08-02 17:49  会前端的洋  阅读(431)  评论(0编辑  收藏  举报