Vue.js 是一种流行的前端 JavaScript 框架，但是 Vue.js 的官方文档中默认不支持 IE8 及以下浏览器，这让许多开发者头痛不已。本文将介绍如何在 Vue.js 中兼容 IE8 及以下浏览器。
兼容性问题及解决方法
Vue.js 依赖 ES5 的一些新特性，而 IE8 及以下浏览器不支持这些新特性，导致 Vue.js 在这些浏览器上无法正常运行。要解决这个问题，我们需要用到一些 polyfill。
ES5 polyfill
首先，我们需要引入 ES5 polyfill，可以使用 es5-shim 和 es5-sham 库，代码如下：
<!-- es5-shim --> <script src="https://cdn.jsdelivr.net/es5-shim/4.5.13/es5-shim.min.js"></script> <!-- es5-sham --> <script src="https://cdn.jsdelivr.net/es5-shim/4.5.13/es5-sham.min.js"></script>
这两个库提供了 ES5 新特性在低版本浏览器的兼容性支持。
JSON polyfill
另外一个必要的 polyfill 是 JSON，IE8 及以下浏览器不支持原生的 JSON 对象，我们需要手动添加一个 polyfill，代码如下：
<script src="https://cdn.jsdelivr.net/json3/3.3.2/json3.min.js"></script>
json3 库提供了 JSON 对象在低版本浏览器的兼容性支持。
vue-polyfill
除了上述两个 polyfill，我们还可以使用 vue-polyfill 库，它封装了所有必要的 polyfill，并提供了一个全功能的 Vue.js，可以在低版本浏览器上正常运行 Vue.js 应用程序。代码如下：
<script src="https://unpkg.com/vue-polyfill"></script>
此外，vue-polyfill 也支持像 Promise、Object.assign、Array.prototype.find 等一些其他的 ES2015/2016 特性。
示例代码
下面是一个简单的 Vue.js 应用程序，可以在 IE8 及以下浏览器上正常运行，示例代码如下：
-- -------------------- ---- -------
--------- -----
----- ----------
------
----- ----------------
------------- -- --- --------------
------- ------------------------------------------------------------------------
------- ------------------------------------------------------------------------
------- -----------------------------------------------------------------
------- ----------------------------------------------
-------
------
---- ---------
--------------------
------- ----------------------------------
----------------
------
--------
--- -- - --- -----
--- -------
----- -
-------- ----- --------
------ -
--
-------- -
---------- ---------- -
---------- -- --
-
-
---
---------
-------
-------通过添加必要的 polyfill 库，并使用 vue-polyfill 将 Vue.js 引入到应用程序中，我们可以在 IE8 及以下浏览器上成功运行一个简单的 Vue.js 应用程序。
总结
通过本文的介绍，我们可以知道如何在 Vue.js 中兼容 IE8 及以下浏览器，但是在实际开发中，应尽量避免使用低版本浏览器，推荐使用最新版本的浏览器来访问应用程序，这将保证更好的性能和体验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a5a8dc48841e989422ac65