解决vue在IE中,数据不同步,视图不更新,打开ie调试时数据数据视图就更新了的问题

1 最近项目要支持ie,这也是最令人蛋疼的地方,相信不少朋友被之前的ie低版本坑的不轻,废话不多说,先来介绍一下,ie11中出现的奇葩现象
2 当你用vue加axios,发请求,请求后端接口更新数据,实现视图同步更新,这个操作在ie本地,谷歌以及360等浏览器是没有问题的,但是鄙人发现,一旦你把项目打包后,发到服务器上在ie上访问,就会发现,你用axios发请求,更新页面的列表数据,当你删除列表中的一个数据后,肯定还需要调用相同的接口,用来更新删除后的列表,从而让视图更新,结果你会发现,ie上是不会更新删除后的数据列表的,这个问题,就是ie浏览器的一种机制导致的,ie浏览器会对相同请求的ajax,进行缓存,当你删除数据后,在调用同样的接口,ie不会刷新,只会把第一次请求该接口的数据拿出来,所以,你看到的页面永远都是第一次请求的ajax返回的数据
3 解决办法:

image.png

打开ie调试页面,你会发现,'始终从服务器刷新'打开了,这就是为什么打开调试,页面就能同步更新数据,此时我们把始终从服务器刷新去掉,切换到网络,查看接口的请求的状态,当你删除一个数据后,同样的接口就会出现一个状态码304,百度了一下,304表示的是 ' 只读/无变化 Not Modified ',这就是问题的原因所在,所以我们要解决问题,就需要让ie每次请求接口,都要它认定这个不是同一个接口,那么下面的方法,比较简单的解决了这个问题


image.png

是的,给每个接口在请求的时候加上时间戳,这样 每次请求接口都是当前时间的最新时间,从而骗取ie的请求,达到解决问题的效果

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,749评论 1 45
  • 国家电网公司企业标准(Q/GDW)- 面向对象的用电信息数据交换协议 - 报批稿:20170802 前言: 排版 ...
    庭说阅读 11,184评论 6 13
  • Getting Started Burp Suite 是用于攻击web 应用程序的集成平台。它包含了许多工具,并为...
    Eva_chenx阅读 28,857评论 0 14
  • 点击查看原文 Web SDK 开发手册 SDK 概述 网易云信 SDK 为 Web 应用提供一个完善的 IM 系统...
    layjoy阅读 13,950评论 0 15
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,814评论 1 92