vue+element +IE问题大汇总!

先来看看问题! 

  1. 看看有没有get请求??为啥把他放首位呢?当然是他最坑啊!!
  2. el-dialog body中IE会默认居中
  3. 在IE兼容模式有的二级页面下的模态框会显示不全
  4. IE是不能满足flex布局的,但是有种方法让他支持\(^o^)/~

解决方案 :

1、问题:看看有没有get请求?

 解决:两次get请求 url和参数一样的情况下IE会缓存返回结果,造成真实数据被替代!

所以,需要在get请求的请求头加唯一标识。

参照我封装的get请求直接引用即可,记得判断get多个参数的时候哦!

//axios封装
import axios from 'axios'
const qs = require("qs"); //将数据转成表单

//get方法封装
export function get(url, params) {
  return new Promise((resolve, reject) => {
    //随机36位码
    let s = [];
    let hexDigits = "0123456789abcdef";
    for (let i = 0; i < 36; i++) {
      s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
    }
    s[14] = "4";
    s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);
    s[8] = s[13] = s[18] = s[23] = "-";
    var num_only = s.join("");
    let url2 = ''
    if(url.indexOf('?')!=-1){
      url2=url+'&p='+num_only
    }else if(params==''||params==undefined){
      url2=url+'?p='+num_only
    }else{
      url2=url+'&p='+num_only
    }
    axios.get(url2, {
        params: params
      })
      .then(res => {
        if(res.data.code == 1000){
          Message.error(res.data.msg)
          router.replace({
            path: '/',
          });
        }else{
          resolve(res);
        }
      })
      .catch(err => {
        if (err.response) {
          Message.error('系统错误')
         } else {
          Message.error('网络错误');
         }
      })
  });
}

2、问题:el-dialog body中IE会默认居中

解决:

  •  style="width:100%"
  •  style="float:left"

3、问题:在IE兼容模式有的二级页面下的模态框会显示不全 

解决:加入加粗字体即可

<el-dialog title="修改密码" :visible.sync="passwordModal" :close-on-click-modal='false' :append-to-body='true'

 width="400px" center>

</el-dialog>

4、问题:IE是不能满足flex布局

解决:加入float: left;即可

举个例子:

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章