vue设置全局变量和函数

版权声明：转载请注明博主地址 https://blog.csdn.net/weixin_43885417/article/details/84962784

一. 定义全局变量：
1. 首先，创建一个全局变量模块文件，在模块里定义一些变量， export default语句暴漏出去。
2. 我们使用全局变量有两种方式：
创建Global.vue文件

<script>
const name = 'https://mp.csdn.net/mdeditor#';
    export default{
      name 
    }
</script>

方式一：当然，我们也可以在所需要的模块中直接引入。

 <template>
    <div>{{ name}}</div>
</template>
<script>
import global from '../../components/Global.vue'           // 引用模块进来
export default {
 data () {
    return {
         name:global .name   ,//将全局变量赋值到data里面，也可以直接使用global.name
        }
    }
}
</script>
<style lang="scss" scoped>
</style>

方式二：我们在main.js中引入，通过vue.prototype挂载到Vue 实例上面。
main.js文件里面，将上面那个Global.vue文件挂载到Vue.prototype。

import global from './components/Global'//引用文件
Vue.prototype.GLOBAL = global//挂载到Vue实例上面

然后，可以直接在任何组件中直接——>global.+你的变量名 就行了。