最近在搞一个基于vue的后台管理系统兼容IE浏览器,眼泪都要掉下来。后来和产品说了,同意兼容IE11,感动得我眼泪啊
这里也就是记录一下我遇到的超级烦的错误
,首先是“babel-polyfill”和,“autoprefixer-loader”这个不用多说,资源一大堆
然后打包之后一直,,const 去不掉,查了之后,是要把webpack版本往下调,我是拒绝的
<强> 1,IE 新的日期()失败
新日期(“2018-1-1”)//Mon 2018年1月01就是格林尼治标准时间+ 0800(中国标准时间)铬//即无效的日期
新日期(“2018/1/1”)//Mon 2018年1月01就是格林尼治标准时间+ 0800(中国标准时间)铬//Mon 2018年1月01就是格林尼治标准时间+ 0800(中国标准时间)即
<强> 2,在IE里,点击输入类型=复选框多次点击会逻辑混乱
原因:在IE中,多次点击之后会同时出发双击鼠标和点击事件,而这两个事件是一起执行了点击事件,会导致点击事件失效
$("输入(type=案囱】颉?”)。attr (“ondblclick”、“this.click () ');
或
$ (' .content ')。(“双击”,“输入(type="复选框")”,函数(){
this.click ();//把双击事件变成单击事件
})
之前
注意,要判断是否是IE浏览器,要不然会把chrome带进沟里
<强> 3、输入占位符会触发输入事件
意思就是说你渲染上去了,可能会自动触发一次输入,然后清空了文本,又触发一次
这东西的兼容就见仁见智了,用时间来代替占位符也是可以的嘛,不多哔哔
<>强4、输入type=文件中,将其置空清除缓存会在IE中触发改变事件,
=$ var文件名(这).val ();
文件名==定义
这东西的兼容就见仁见智了,可以判断一下文件名,不多哔哔
<强> 5,输入类型=文本中,文本溢出:ellpsis失效
输入输入框如果东西太多,希望展示位,,……省略号,但是chrome成功了,即失败了
需要将输入标签置为只读的才能起作用
没错,这东西是iview选择里的输入标签
:
initTheSelect () {
var=document.querySelector(输入”。ellipsisInput .ivu-select-selection .ivu-select-input”);
输入。setAttribute(“只读”,真正的);
输入。addEventListener(“点击”,函数(params) {
input.removeAttribute(“只读”);
input.focus ()
});
输入。addEventListener(“模糊”,函数(params) {
输入。setAttribute(“只读”,真正的);
})
}，
之前
<强> 6,在IE中,本系统是使用了cookie来保存验证信息的,但是没多久就能发现发送的请求都不携带饼干而导致重新登录
查看了,是304年即读取缓存的时候,不会携带饼干,然后一旦读到一个,重新登录,你这个系统基本就完的了,一直从缓存里读取,你登录了?诶,有缓存,我拿缓存吧。
缓存:咳咳,你不是上次重新登陆吗?我给你存着呢,给给给,重新登录去吧。
所以要么设置即不缓存,要么代码改
,后端设置,前端的设置要么不保险(神tm时灵时不灵),要么就是太麻烦,后端几行代码搞定
不允许浏览器端或缓存服务器缓存当前页面信息。
响应。setHeader(“杂注”,“no - cache”);
响应。setDateHeader(“到期”,0);
响应。addHeader (cache - control, " no - cache ");//浏览器和缓存服务器都不应该缓存页面信息
响应。addHeader (“cache - control”,“不是商店”);//请求和响应的信息都不应该被存储在对方的磁盘系统中;
响应。addHeader (“cache - control”、“must-revalidate”); *//于客户机的每次请求,代理服务器必须想服务器验证缓存是否过时;
2018-11-14
僵持住了,还是我这边改吧
axios.interceptors.request.use (
配置=比;{//给每个请求加上一个专业的时间参数
如果(window.navigator.userAgent.indexOf祝辞(“三叉戟”);1){
配置。url=配置。url + ' & # 63;专业=${新的日期().getTime ()}”
}
返回配置;
}，
呃=比;{
返回Promise.reject (err);
});
