vue中用iframe嵌套页面,点击返回实现真正的退回上一步功能
vue项目中需要嵌套第三方的页面,但是第三方页面中的网页没有返回按钮,如图所示:此为页面b,页面a为跳到b页面的前一个页面。点击iframe嵌套页面跳转的第二个页面要实现不管进入多少层iframe页面,点击回退都直接跳到页面a.实现:为了不影响路由判断,使用回退的方法。首先在进入页面b时,记录一下history.length,并把这个值赋给页面的一个变量:data () {...
·
vue项目中需要嵌套第三方的页面,但是第三方页面中的网页没有返回按钮,如图所示:此为页面b,页面a为跳到b页面的前一个页面。
点击iframe嵌套页面跳转的第二个页面
要实现不管进入多少层iframe页面,点击回退都直接跳到页面a.
实现:
为了不影响路由判断,使用回退的方法。
首先在进入页面b时,记录一下history.length,并把这个值赋给页面的一个变量:
data () {
return {
para:{},
htmlStr:'',
htmlSrc:'',
rlen:history.length,
}
},
mounted () {
},
methods: {
//返回
goBack () {
let len = this.rlen - history.length - 1;//-1是不进入iframe页面的下级页面直接退出的话,执行后退一步的操作
this.$router.go(len);
},
}
在点击返回按钮时,重新获取一下history.length,并用刚进入b页面记录的值去减去最新的history.length,即可获取到需要回退的步数。
注:history.length:浏览器历史列表中的元素数量
更多推荐
已为社区贡献21条内容
所有评论(0)