Vue.js在IE的相容性

交付的網站被客戶反映不支援 IE，對此我原本是不抱持任何希望，覺得 IE 不可能可以用 Vue，大概只能跟客戶吵架，或者是全部改寫了…

但花了點時間仔細探究原因，赫然發現其實 Vue 是可以在 IE 上面運作的，只是需要注意這幾件事情：

1. Head 宣告相容性

1

<meta http-equiv="X-UA-Compatible" content="ie=edge" />

html 的 head 區塊要宣告X-UA-Compatible這個 meta data，告訴 IE 使用最新的標準進行渲染

2. 不要使用箭頭函數(Arrow Function)

此部分才是我程式掛掉的主要原因，我把它用在vue-resource的程式碼上，例如

1
2
3
4
5
6
7
8

$http.get(API_URL).then(
  (res) => {
    //do sometihng...
  },
  (res) => {
    //when error...
  }
);

其中有用到=>的部分就是 IE 不支援的部分，要改回傳統的做法，乖乖傳一個 callback 進去

1
2
3
4
5
6
7
8

$http.get(API_URL).then(
  function (res) {
    //do sometihng...
  },
  function (res) {
    //when error...
  }
);

後記

目前測試的結果改成這樣我的畫面就正常顯示了，真是可喜可賀，不然如果全部要砍掉改回用 jquery 重寫一次我應該會哭倒在辦公桌前。

唯一的問題就是我只測了 IE11，不知道可以相容到 IE 幾….希望客戶不會跟我說 IE6 要可以用 ・゜・(PД`q｡)・゜・