vue-Ie下踩坑20190820
开发的vue项目终于告一段落,终于是可以部署在测试服务器给客户看了,期间也是遇到各式各样的坑。
1.有些bug在谷歌是在没问题的,在ie上就会暴露出来,因为其中一个模块设计多个类型资源的列表,所以写纯模板的vue是行不通的,所以考虑写rander或者是jsx,
最终是选择了些jsx,rander当时写的时候还不是特别熟练。(不过看完vue-rander部分的源码,问题不大,还是要多多看源码)。
其间往jsx中传入一个图片的地址,是对象中的一个属性。我传的文件的地址,一直给我报 vue Error in nextTick: "Error: 参数无效。",ie是真的牛逼,这都能检测的出来,
导致我后续所以的字组件都没有渲染出来,请原谅我的无知,刚开始一直以为是ie11不支持jsx,现在想想确实脑洞有点大。
所以下次遇见 vue Error in nextTick: "Error: 参数无效。" 一定要先检测传的数据是否有问题,ie并没有谷歌那么好的包容性。
2.项目上是分前台和后台,前台并没有直接跳到后台的连接,所以是直接在流浪器上改变的连接地址,wtf,尽然不跳转。谷歌上是号的,这又是啥。
所以就仔细分析一下这个问题,首先,ie上的vue-router连接是可以跳转的,所以说ie11是可以使用vue-router,也就是说我们使用this.$router.push 这个方法是可用的
然而我们直接改变链接地址为什么不跳转,那么肯定是ie上这个有bug.既然我们直接改变地址他不跳转,那么我们是否可以监听一下地址,如果地址改变手动执行this.$router.push
查了一下ie上确实是有方法监听ie地址改变的, window.addEventListener('hashchange', ()=>{},false),所以我们再最初的父组件mouted中调价这个监听。发生改变是在执行this.$router.push
if (!!window.ActiveXObject || 'ActiveXObject' in window) {
window.addEventListener('hashchange', () => {
let currentPath = window.location.hash.slice(1)
if (this.$route.path !== currentPath) {
this.$router.push(currentPath)
}
}, false)
}
来源地址:https://www.jianshu.com/p/1e94f20f8672
3.iis上部署项目,因为项目在子文件夹下,所以不能指定默认文档,iis只能执行第一层的文件夹的文件作为默认文档,所以我们可以新建一个默认文档,然后在做一次跳转
<script>window.location.href='/static/index.html'</script>
vue-Ie下踩坑20190820的更多相关文章
- vue配置环境踩坑
Vue 环境配置踩坑 目录 Vue 环境配置踩坑 windows下cnpm -v :无法将"cnpm"项识别为 cmdlet.函数.脚本文件或可运行程序的名称. windows下c ...
- vue+ vue-router + webpack 踩坑之旅
说是踩坑之旅 其实是最近在思考一些问题 然后想实现方案的时候,就慢慢的查到这些方案 老司机可以忽略下面的内容了 1)起因 考虑到数据分离的问题 因为server是express搭的 自然少 ...
- HttpClient在多线程环境下踩坑总结
问题现场 在多线程环境下使用HttpClient组件对某个HTTP服务发起请求,运行一段时间之后发现客户端主机CPU利用率呈现出下降趋势,而不是一个稳定的状态. 而且,从程序日志中判断有线程处于han ...
- vue cli+axios踩坑记录+拦截器使用,代理跨域proxy(更新)
16319 1.首先axios不支持vue.use()方式声明使用,看了所有近乎相同的axios文档都没有提到这一点建议方式 在main.js中如下声明使用 import axios from 'ax ...
- vue cli+axios踩坑记录+拦截器使用,代理跨域proxy
1.首先axios不支持vue.use()方式声明使用,看了所有近乎相同的axios文档都没有提到这一点 建议方式 在main.js中如下声明使用 import axios from 'axios'; ...
- vue + element-ui 制作tab切换(切换vue组件,踩坑总结)
本篇文章使用vue结合element-ui开发tab切换vue的不同组件,每一个tab切换的都是一个新的组件. 1.vue如何使用element-ui 上一篇文章已经分享了如何在vue中使用eleme ...
- vue项目打包踩坑记
基于webpack+vue-cli下的vue项目打包命令是 npm run build ,等待打包完成后在根目录生成dist文件夹,里面包含了所有项目相关的内容. 注意:需要完整版的vue-cli项目 ...
- [ vue ] quasar框架踩坑:在vue文件外导入路由,执行router.push('/')没有效果
问题描述: 1. 如图所示的项目结构目录, axios.js 文件负责拦截全局请求和回复,我在拦截回复的代码中写了:如果服务器回复了一个401错误,则执行Router.push('/'),但是该方法失 ...
- vue搭配axios踩坑
客户端项目中有一个小需求“我的卡券”,有单独入口,所以综合考虑之后,采用了vue来实现,因为是初次使用,导致了选型不当,先用了SUI-Mobile来搭建页面,当决定使用vue的时候,页面也搭建完毕了, ...
随机推荐
- C++入门经典-例2.1-利用实数精度进行实数比较
1:代码如下: // 2.1.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" void main() { float eps = 0.000 ...
- Linux TCP套接字选项 之 SO_REUSEADDR && SO_REUSEPORT
说明 前面从stackoverflow上找了一篇讲这两个选项的文章,文章内容很长,读到最后对Linux中的这两个选项还是有些迷茫,所以重新写一篇文章来做一个总结: 本文只总结TCP单播部分,并且只讨论 ...
- java期末课程总结
期末课程总结 转眼间,这个学期就要过去了,我们Java的学习也接近了尾声,回想到这个学期刚开始接触到Java的时候,感觉什么都不懂,但现在似乎有了门路,不会载懵懵懂懂, 虽然本学期面向对象与Java程 ...
- python3笔记七:break和continue语句
一:学习内容 break语句 continue语句 二:break语句 1. 说明 作用:跳出for和while的循环注意:只能跳出距离它最近的那一层循环 2.举例1 for i in range(1 ...
- php面向对象 2
继承概念:如果一个类有子类,那么该子类会继承父类的一切东西(私有成员访问不到)在定义子类的时候需要加一个关键字:extends特点:单继承,一个类只能有一个父类如果父类中有构造函数,子类在实例化的时候 ...
- P3956 棋盘
P3956 棋盘 题解 注释都在代码里了 这道题可以用DFS做,记忆化搜索,维护一个money[ ][ ] 表示到达当前节点的最小花费 不需要记录VIS,因为有一个最小值判断,如果走重复的话一定会得到 ...
- C++多重继承实践
实践代码如下: #include <iostream> using namespace std; class Animal { private: int hash; public: Ani ...
- 函数参数<二>
1. 缺省参数 调用函数时,缺省参数的值如果没有传入,则被认为是默认值.下例会打印默认的age,如果age没有被传入: def printinfo( name, age = 35 ): # 打印任何传 ...
- mysql的性能优化简介
mysql性能下降的原因 sql语句本身有问题,或没建索引 索引失效,索引失效的原因本文后面会叙述 关联了过多的表,可能是前期设计缺陷,或者太奇葩的需求 服务器调优及参数设置,例如缓冲.线程等 mys ...
- freebsd 隐藏ssh版本号
方案一: vi /etc/ssh/sshd_config VersionAddendum 为空或者no或者别的信息 /etc/rc.d/sshd restart 方案二: https://kram.n ...