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里面也有退出,以上方法将失效。

相关推荐
Cobyte27 分钟前
6.响应式系统比对:通过 Vue3 响应式库写 React 应用
前端·javascript·vue.js
云浪1 小时前
从 0 到 1 搭建 RAG 应用:用 LangChain + Chroma + qwen-plus 实现《红楼梦》问答
javascript·vue.js·人工智能
xiaoxue..1 小时前
react:浅聊 vdom 与 diff 算法
前端·javascript·react.js·面试
止语Lab1 小时前
记忆溢出:当你的 Agent 记得太多时会发生什么
前端·javascript·vue.js
天天向上10241 小时前
vue openlayers地图加载大量点位时优化
前端·javascript·vue.js
devil-J1 小时前
vue3+three.js中国3D地图
开发语言·javascript·3d
这儿有一堆花10 小时前
前端三件套真的落后了吗?揭开现代 Web 开发的底层逻辑
前端·javascript·css·html5
.Cnn11 小时前
JavaScript 前端基础笔记(网页交互核心)
前端·javascript·笔记·交互
醉酒的李白、11 小时前
Vue3 组件通信本质:Props 下发,Emits 回传
前端·javascript·vue.js
小眼哥12 小时前
SpringBoot整合Vue代码生成exe运行程序以及windows安装包
vue.js·windows·spring boot