1.判断iframe是否加载完成的方法
<div>
<iframe
id="ifra"
:src="src"
style="width:100%;height:100%"
>
</iframe>
</div>
iframeLoad() {
this.excelTimer = setTimeout(() => {
let _this = this
const iframe = document.querySelector('#ifra')
// if(iframe){
// const iframeDoc = iframe && iframe.contentDocument ||
iframe.contentWindow.document
// const body = iframeDoc.body
// if (body.hasChildNodes()) {
// _this.loadings[_this.file_url][_this.activeMode] = false
// _this.$forceUpdate()
// console.log("有孩子");
// } else {
// console.log('Body is empty');
// }
// console.log('iframeDoc', iframeDoc.body);
// console.log('ddd是都包含body', iframe)
// }
// 处理兼容行问题 兼容IE
if (iframe.attachEvent) {
iframe.attachEvent('onload', function() {
// iframe加载完毕以后执行操作
_this.excelNum += 1
// if(_this.excelNum === 2){
// _this.loadingExcel = false
// }else {
// _this.loadingExcel = true
// }
// _this.$forceUpdate()
})
} else {
iframe.onload = function() {
_this.excelNum += 1
// if(_this.excelNum === 2){
// _this.loadingExcel = false
// }else {
// _this.loadingExcel = true
// }
if(_this.srcNew){
_this.loadingExcel = false
}
}
}
//在此处给src赋值
src='xxxxxx'
}, 200)
},
2.遇到问题
2.1在来回切换iframe得src时,有的iframe已经加载完成却没进入到加载完成得方法中,
解决方法:把src置空后调用此方法,然后把src的赋值写在方法的最后面
2.2 将src置空后会立马又调一次这个加载方法,但是此时iframe的内容为空白,所以判断src是否为空值再进行操作,比如我这个里面是加载完成后将loading效果去除