vue 之 IE兼容相关处理

2019-10-31  本文已影响0人  hunter97

在之前的文章中说过一些关于兼容IE的方法,今天把关于在使用vue全家桶在开发中遇到的IE的的兼容问题汇总了一下。
开发框架:vue-cli+axios+router+element-ui+mockjs

一、IE和一些低版本的高级浏览器对es6新语法并不支持,使用babel-polyfill
  1. 装载babel-polyfill,cnpm install babel-polyfill --save
  2. 找到build文件夹下webpack.base.conf.js。
module.exports = {
  entry: {
    app: './src/main.js'
  },

改为

module.exports = {
  entry: {
    'babel-polyfill': 'babel-polyfill',
    app: './src/main.js'
  },
二、Pormise的问题,IE等浏览器不支持Pormise,使得axios不能正常使用,使用es6-promise
  1. 装载es6-promisecnpm install es6-promise --save
  2. main.js中引用。
import promise from 'es6-promise';
promise.polyfill();
三、URLSearchParams未定义,IE9支持URLSearchParams。将使用URLSearchParams的地方改为使用qs
  1. 装载qs,cnpm install qs --save
  2. 在需要使用qs的文件,引入import qs from 'qs';
  3. 将原来使用URLSearchParams的地方改为,如下
var params = {
'param1':1,
'param2':2
}
//假设params 为请求参数
qs.stringify(params)

基本上这个方法只会在axiospost方法用到。

·····其他相关问题。
  1. GET方法在IE9会直接默认去拿缓存,某些时候返回的是304而不是正常拿到数据后的200.这个就在GET方法的params中加个时间戳就行了。time:new Date().getTime()
  2. 在使用axios时,在then函数后面切记要用catch函数承接错误,不然可能会出现不易排查的错误。

不管发生什么事,都请安静且愉快地接受人生,勇敢地、大胆地,而且永远地微笑着。

上一篇下一篇

猜你喜欢

热点阅读