我是靠谱客的博主 坦率口红,最近开发中收集的这篇文章主要介绍关于iframe加载页面会增加浏览器history记录的问题,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

浏览器的history是不支持删除的,因为MDN上都没有给删除的方法

所以在页面里嵌套了多个iframe的时候,切换,就会增加history记录,使用了history.replaceState()不行,

window.location.replace()也不行

后来问了朋友,说是iframe重复加载的问题,具体原因是iframe的DOM复用 终极办法还是每次新建iframe dom

多个iframe之间的加载,要有间隔时间,不能太快了

<template>
<div style="height:750px;">
<button @click="changeTab(0)">
校本资源
</button>
<div style="display:inline-block;width:100px;"></div>
<button @click="changeTab(1)">
个人资源
</button>
<iframe v-if="show1" class="home" src="http://localhost:9529/learnSystem/schoolRes?lms-token=4Q29zjVaspXNdbGxYzyJ5XZtfR8UCeVy52om0exJEUXMr8HOr1sHYcGpba9k" frameborder="0"></iframe>
<iframe v-if="show2" class="home" src="http://localhost:9529/learnSystem/personalRes?lms-token=4Q29zjVaspXNdbGxYzyJ5XZtfR8UCeVy52om0exJEUXMr8HOr1sHYcGpba9k" frameborder="0"></iframe>
</div>
</template>
<script>
/* eslint-disable */
export default {
name: 'Home',
data () {
return {
show1: true,
show2: false
}
},
mounted() {
console.log(window)
},
methods: {
changeTab (num) {
if (num) {
this.show1 = false
setTimeout(() => {
this.show2 = true
}, 2000)
} else {
this.show2 = false
setTimeout(() => {
this.show1 = true
}, 2000)
}
}
}
};
</script>
<style>
.home {
width:100%;
height:100%;
}
</style>

最后

以上就是坦率口红为你收集整理的关于iframe加载页面会增加浏览器history记录的问题的全部内容,希望文章能够帮你解决关于iframe加载页面会增加浏览器history记录的问题所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(44)

评论列表共有 0 条评论

立即
投稿
返回
顶部