vue-cli全局變量配置方法

http://blog.csdn.net/just_for_your_smile/article/details/78815783

一.定義不變的vue全局變量

一般我們都會定義一些 常量，比如基礎的訪問域名， 靜態資源版本號。

可以將該常量綁定到vue的全局屬性上即可：

 

Vue.prototype.getTitle = {  
      title:'',  
      isBack: true,  
      isAdd:  false,  
    };  

    Vue.prototype.baseUrl = function () {  
          return 'http://csdn.net';  
        };  

 

 

添加方法（在vue-cli中使用）：

1直接將上面任一個 改代碼放入 ''src/main.js" 中， 即可定義全部變量。

 

2類似這種配置， 可以單獨起一個配置文件，

 

（1）可以在項目的src 目錄里面 新建一個 lib目錄 。lib目錄里創建一個 config目錄， 然后在config目錄里新建一個config.js文件.

src\lib\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);  

 以上就可以定義全局變量了。

 

 使用方法

（1）直接在模版中調用

 

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

（2）js代碼中使用

 

this.getTitle