vue-cli全局变量

一.定义不变的vue全局变量

一般我们都会定义一些 常量,比如基础的访问域名, 静态资源版本号。

可以将该常量绑定到vue的全局属性上即可:

 
 
1.函数
Vue.prototype.baseUrl = function () {
      return 'http://csdn.net';
    };
2.变量
Vue.prototype.getTitle = {
      title:'',
      isBack: true,
      isAdd:  false,
    };

添加方法( 在vue-cli中使用):

1直接将上面任一个 改代码放入 ''src/main.js" 中, 即可定义全部变量。

2类似这种配置, 可以单独起一个配置文件,

(1)可以在项目的src 目录里面 新建一个 lib目录 。lib目录里创建一个 config目录, 然后在config目录里新建一个config.js文件.


(2)然后在config.js文件里写上

export default {
  install(Vue,options)
  {
    Vue.prototype.baseUrl = function () {
       return '111';
    };
    Vue.prototype.getTitle = {
      title:'',
      isBack: true,
      isAdd:  false,
    };
    Vue.prototype.showFootTab = {
      isShow:false,
      active:0,
    }
  }
}

(3)最后还要在vue-cli里面引用

           在 根目录下的 main.js中 添加下面两行代码即可

      

        import config from './lib/config/config.js'

        Vue.use(config);

 以上就可以定义全局变量了。


2使用方法

(1)直接在模版中调用

<template>
  <div>
    {{getTitle.title}}
  </div>
</template>

  (2)js代码中使用


this.getTitle



猜你喜欢

转载自blog.csdn.net/just_for_your_smile/article/details/78815783