uni-app左上角退出,嵌套iframe退出异常问题

1. 问题分析

复制代码
<v-link
  tag="div"
  v-if="symbol"
  :to="{ path: '/pages/exchange/index', query: { code: symbol} }"
>
</v-link>

uni-app使用 :to 跳转的页面中内嵌了一个iframe,如果iframe页面内进行了点击跳转,用vue-router的返回,是无法回到期望的vue页面。

2. 原因分析

执行vue-router的返回,回退的只是iframe导航,如果iframe里面点击了多次,使url发生变更,那么用户要点击很多次才能真正的返回。

3.解决方案

定义参数:

复制代码
rlen: history.length,// history.length:浏览器历史列表中的元素数量

定义方法

复制代码
backTo() {
  //-1是不进入iframe页面的下级页面直接退出的话,执 行后退一步的操作
  let len = this.rlen - history.length - 1;
  this.$router.go(len);
}

调用

复制代码
<view @click="backTo">
  <i class="van-icon van-icon-arrow-left van-nav-bar__arrow"></i>
</view>

注意:如果iframe里面也有退出,以上方法将失效。

相关推荐
Aric_Jones17 分钟前
JavaScript 从入门到精通:完整语法指南
开发语言·javascript·ecmascript
西门吹-禅3 小时前
文本搜索node js--meilisearch
开发语言·javascript·ecmascript
问今域中4 小时前
Vue的computed用法解析
前端·javascript·vue.js
扶苏10025 小时前
详解Vue3的provide和inject
前端·javascript·vue.js
予你@。5 小时前
UniApp + Vue3 实现 Tab 点击滚动定位(微信小程序)
微信小程序·小程序·uni-app
奋斗吧程序媛6 小时前
Vue3初体验(2)
前端·javascript·vue.js
游戏开发爱好者86 小时前
完整教程:App上架苹果App Store全流程指南
android·ios·小程序·https·uni-app·iphone·webview
FunW1n7 小时前
tmf.js Hook Shark框架相关疑问归纳总结报告
java·前端·javascript
henry1010107 小时前
Deepseek辅助生成的HTML5网页版抄经典《弟子规》
前端·javascript·css·html·html5
一 乐8 小时前
林业资源管理|基于java + vue林业资源管理系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·林业资源管理系统