关于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>