[vue] 嵌套iframe,$router.go(-1)后退bug

问题 :更改iframe中src值后导致的路由跳转混乱,多次更改iframe的src属性后,调用router.go(-1),不能实现路由后退上一级
原因:还是在于通过ifream.src赋值,因为域相同,还是会向window.history中插入一条历史记录

之前的代码

js 复制代码
<iframe ref="iframe" :src="url" scrolling="auto" frameborder="0" width="100%" height="100%"></iframe>
<script>
  export default {
    methods:{
      setIframeSrc(){
        this.url = '新url'
      }
    }
  }  
</script>

解决办法

去掉:src="url" ,增加this.$refs.iframe.contentWindow.location.replace

js 复制代码
<iframe ref="iframe" scrolling="auto" frameborder="0" width="100%" height="100%"></iframe>
<script>
  export default {
    methods:{
      setIframeSrc(){
      	this.url = '新url'
        this.$refs.iframe.contentWindow.location.replace(this.url)
      }
    }
  }  
</script>

参考:

嵌套iframe,$router.go(-1)后退bug

相关推荐
糊涂涂是个小盆友2 小时前
前端 - 使用uniapp+vue搭建前端项目(app端)
前端·vue.js·uni-app
开心工作室_kaic5 小时前
ssm111基于MVC的舞蹈网站的设计与实现+vue(论文+源码)_kaic
前端·vue.js·mvc
bug爱好者6 小时前
如何解决sourcetree 一打开就闪退问题
前端·javascript·vue.js
迂 幵6 小时前
vue el-table 超出隐藏移入弹窗显示
javascript·vue.js·elementui
上趣工作室6 小时前
vue2在el-dialog打开的时候使该el-dialog中的某个输入框获得焦点方法总结
前端·javascript·vue.js
家里有只小肥猫6 小时前
el-tree 父节点隐藏
前端·javascript·vue.js
_xaboy8 小时前
开源项目低代码表单设计器FcDesigner扩展自定义的容器组件.例如col
vue.js·低代码·开源·动态表单·formcreate·低代码表单·可视化表单设计器
_xaboy8 小时前
开源项目低代码表单设计器FcDesigner扩展自定义组件
vue.js·低代码·开源·动态表单·formcreate·可视化表单设计器
mez_Blog8 小时前
Vue之插槽(slot)
前端·javascript·vue.js·前端框架·插槽
爱睡D小猪8 小时前
vue文本高亮处理
前端·javascript·vue.js