首页 > 其他分享 >vue 嵌套全屏iframe 能有效避开返回两次才能返回上一个路由的问题

vue 嵌套全屏iframe 能有效避开返回两次才能返回上一个路由的问题

时间:2023-09-12 16:11:15浏览次数:34  
标签:返回 src vue bottom route 全屏 iframe query type

<template>   <div class="home">     <iframe ref="iframe" class="iframe" frameborder="no"></iframe>   </div> </template>
<script> import {   get_doctor_info,   statistics,   query_backlog_task, } from "@/request/api/http.js"; import { Toast } from "vant"; export default {   data() {     return {       currentDingtalk: {},       url: "",     };   },
  mounted() {     this.currentDingtalk = JSON.parse(sessionStorage.getItem("userInfo"));     this.init();     console.log(this.$route.query.type);   },
  methods: {     init() {       if (this.$route.query.type == 3) {         let src =           "https://m.xiaohe.cn/tool/food/eat?utm_medium=copy_link&utm_source=lvsongguoAPP";         this.$refs.iframe.contentWindow.location.replace(src);       } else if (this.$route.query.type == 4) {         let src = "https://miying.qq.com/guide-h5/home?appid=z2hospitail";         this.$refs.iframe.contentWindow.location.replace(src);       }     },   }, }; </script>
<style lang="scss" scoped> .home {   padding-bottom: calc(20px + constant(safe-area-inset-bottom));   padding-bottom: calc(20px + env(safe-area-inset-bottom));   .iframe {     position: fixed;     height: 100%;     width: 100%;     top: 0;     left: 0;     border: none;   } } </style>

标签:返回,src,vue,bottom,route,全屏,iframe,query,type
From: https://www.cnblogs.com/dreammiao/p/17696480.html

相关文章

  • vue 学习
    1.给对象动态添加属性和值varobj={   name:"jack",   age:"18"}第一种:Vue.set(obj,'sex','18');第二种:this.$set(this.obj,'score',90);第三种:obj.score=100;直接赋值的方式不能触发Vue的响应式系统。如果我们需要在模板中使用动态添加的属性,建议使用Vue.set......
  • Vue3中使用pinia全局状态管理库
    ❝本期介绍一下pinia在vue3中的简单使用,以及如何使用pinia实现多页面状态共享。❞什么是piniaPinia是一个用于Vue应用程序的轻量级状态管理库。与vuex的区别pinia是vue3的官方状态管理库,vuex是vue2的官方状态管理库pinia更加轻量级pinia能更好的配合Vue3与TSpinia的使用比Vuex简......
  • docker部署springboot+vue项目环境安装及部署流程
    后端项目打jar包修改及配置项1、修改配置文件application-prod.yml中的mysql配置和redis配置2、切换Maven为生产模式3、Maven打包4、拿到打包后的jar 包5、拿到jar包之后在Linux中使用nohupjava-jarjeecg-system-start-3.5.0.jar>catalina.out2>&1&命令即可启动项......
  • Ant Design Vue Table 嵌套子表格的数据刷新方法
    父子组件各自负责,在table中嵌套了子表格后,首次加载表格时,父组件会实例化子组件并传递参数,折叠后再次展开时,只会传递参数,子组件的数据刷新就属于子表格了。如@@@code<template#expandedRowRender="{record}"><originIndexs......
  • vue-i18n
    https://kazupon.github.io/vue-i18n/zh/introduction.html开始如果使用模块系统(例如通过vue-cli),则需要导入Vue和VueI18n,然后调用Vue.use(VueI18n)。格式化在某些情况下,你可能希望将翻译呈现为HTML信息而不是静态字符串。在你的网站上动态插入任意HTML可能......
  • 接口未通时,模拟接口返回数据
    调用接口未接通时,可以用Promise.resolve()或者Promise.reject()模拟成功和失败的返回eg:正常写法exportfunctiongetData(){returnrequest({method:'get',url:'xxx'})}模拟成功exportfunctiongetData(){returnresolve({cod......
  • Vue2——监听页面滚动实现菜单和页面对应
    前言如题,监听页面的滚动并激活相应的菜单,一个老项目的维护,后面反正要全部重构,这里就先实现功能就好了;内容元素内容主要是添加相应的id,生成目录后直接通过锚点来跳转监听滚动window.addEventListener('scroll',()=>{constsections=document.getElementsByCla......
  • Taro+vue3 关注抖音号
     Taro使用vue3或者react框架,data-aweme-id属性是不被解析到生成的页面代码中的,所以需要借助编译插件@tarojs/plugin-inject去注入标签属性;https://taro-docs.jd.com/docs/vue-overall#dataset业务页面:<buttonopen-type="openAwemeUserProfile":dataAwemeId="awemeId">关注......
  • Vue.js的index.html文件中引入JavaScript文件
    将js文件放在public文件夹下面在index.html文件下引入js文件在前面加<%=BASE_URL%>后面加路径,如果想将本地js文件打包之后也放在static/js文件夹下,需要在public文件夹下创建一个和打包之后文件放的位置一样的文件夹<scriptsrc="<%=BASE_URL%>./static/js/js文件名"></sc......
  • onBackPressed 设置返回值,onActivityResult resultcode一直是0
    activity1:Intentintent2=newIntent(this,checkactivity.class);startActivityForResult(intent2,1000);activity2:@OverridepublicvoidonBackPressed(){super.onBackPressed();Intentintent=newIntent();setResult(result,in......