vue自定义全局变量和全局函数

封装方法

1、创建common_js.js

exports.install = function (Vue , options){
    Vue.prototype.changeData = function(){
        console.log("执行成功");
    }
}

2、在main.js里引用并使用

import common_js from 'common_js'
Vue.use(common_js);

3、在所有组件里可调用函数

 this.changeData();

封装全局变量

1、创建global_variable.js文件

const baseURL = 'www.baidu.com'
const token = '123456'

export default{
    baseURL,
    token
}

局部使用

<script>
import GLOBAL from 'global_variable'
export default{
    data(){
        return{
            tolen:GLOBAL.token
        }
    }
}
</script>

全局使用

将global_variable.js引入main.js,并用Vue.prototype 挂载到原型上

import globalVariable from 'global_variable.js'

Vue.prototype.$global = globalVariable;

在模块文件中使用

<script>
export default{
    data(){
        return{
            tolen:this.$global.token
        }
    }
}
</script>
发布了44 篇原创文章 · 获赞 15 · 访问量 5万+

猜你喜欢

转载自blog.csdn.net/Sunshine0508/article/details/89497868