在做Vue專案中經常會遇到某些方法或變數、常量需要跨元件呼叫，使用時不能再元件內區域性宣告，這是後就需要有一個地方來單獨的存放這些全域性的變兩或方法，下面我就簡單接介紹一下這個全域性檔案建立的大概流程以及呼叫方法；

第一步：新建一個.vue的檔案來儲存全域性變數或方法；我建立的檔名為global.vue;內容如下

<script>
  const websocket = new window.WebSocket("ws://192.xxx.0.xx:xxxx");


  const doSend = function (message) {
    writeToScreen("SENT: " + message);
    websocket.send(message);
  };

  const writeToScreen = function (message) {
    console.log(message);
  };
  export default {
    websocket,
    doSend,
    writeToScreen

  }
</script>
 

檔案內儲存了一個常量和三個方法，方法使用const以宣告常量的方式來宣告是為了保證在專案內方法名不會再次被宣告佔用；

第二步：在main.js中引入和宣告；

import global_ from './components/Global'//引用檔案
Vue.prototype.GLOBAL = global_ //掛載到Vue例項上面

注：如果不是很多元件都需要呼叫global檔案內的方法的話，就可以不在main.js內引入宣告，只需要在使用的元件內引入宣告即可；

第三步：在元件內使用

使用時直接呼叫即可，我專案中的使用例項如下

userList: function () {
        let curSession = sessionStorage.getItem("sessionId");
        let userListRequest = {
          "command": 1026,
          "session": curSession,
          "request": null
        };
        this.GLOBAL.doSend(JSON.stringify(userListRequest));
      },