内嵌的H5是用的vue2版本开发的,期间有很多的坑要踩:

1、调用app返回上一个页面不触发页面的onmouted和window.onPageShow

  app返回上一个页面调用的方法并不会出发vue的页面更新也不触发浏览器的回退事件。

  最后使用的是window.history才触发了页面的回退事件

2、唤起软键盘后页面高度变化

  因为是内嵌app的H5页面,没有测试机,也未安装虚拟机暂时无法测试

3、因为是内嵌页面,会遇到一个问题就是,底部tab打开的页面相当于浏览器的窗口,同时存在几个窗口,vuex没有触发,但是这个时候又需要几个页面之间进行通信

  解决方案是使用local缓存,然后在页面使用watch进行监听,变相的实现了事件触发

app内嵌H5踩坑的更多相关文章

  1. 移动端开发利器vConsole.js,app内嵌H5开发时调试用

    vConsole:一个轻量.可拓展.针对手机网页的前端开发者调试面板,主要还是用于内嵌app页面时在手机上进行调试,打印完全和在PC端一样,方便大家找出问题所在. 不说废话直接进入主题,vConsol ...

  2. app内嵌H5调用分享

    最近产品提出了一个需求:我们在合作方的app中提供的部分页面中增加分享页面,具体要求是在3个二维码推广页面调用app的分享接口,分享方式有3种,分别是点击”分享链接“按钮调起分享,点击”分享图片“按钮 ...

  3. ios下app内嵌h5页面是video适配问题

    ios下做新闻详情用h5页面实现然后打包到app中,其中新闻详情页会有视频,安卓下video的poster可以做到适应video大小,但是ios下会按照poster图片大小将video等比撑大,但是视 ...

  4. app内嵌H5网页(webviewJavaScriptBridge)

    摘要:使用的插件为webviewJavaScriptBridge,app端需要引入一下这个包,html页面只需一段JS代码 与IOS交互 <! 申明交互(此处代码固定) > functio ...

  5. app内嵌h5分享到小程序分享功能

    if (this.GLOBAL.env !== 'production') { try { window.JSBridge.shareMiniProgramToWx('https://www.lexi ...

  6. app内嵌H5的上传图片的功能

    1.上传组件 <!-- - hasBorder {Boolean} cell底部边框,oneline 为 true 有效 - inlineBorder {Boolean} cell底部短边框 - ...

  7. app内嵌h5页面在ios手机端滑动卡顿的解决方法

    1.带滚动条的dom需加样式 -webkit-overflow-scrolling: touch;2.去掉 width:100%; height:100%

  8. app内嵌 h5页面 再滑动的时候 触发击穿底下的一些touchstart事件

    我们的目的是再滑动的时候 不要触发到touchstart事件. // 再滑动的时候无法点开视频 var is_scroll_start,is_scroll_end; $(window).on({ 't ...

  9. APP内的H5页面测试方法, 移动端的浏览器(例如UC浏览器)测试方法

    前言: 用appium做UI自动化,测试APP里面的H5和测试手机浏览器打开的H5的操作流程上是有所区别的.比如要测试APP内嵌的H5需要先操作appium启动APP,然后通过context切到web ...

  10. APP中内嵌H5页面为什么不能下载?

    在APP中内嵌H5页面,若页面上存在下载链接,没有任何反应,为什么呢? 原因是app中内嵌的H5页面是WebView解析的,什么是WebView呢? 在Android手机中内置了一款高性能webkit ...

随机推荐

  1. 过年必备!亲戚计算器「GitHub 热点速览 v.23.02」

    过完这周大家就要开始为期 7 天的春节长假了,当然有些 HG 小伙伴拥有了 10+ 天的长假就低调点不要告诉他人,以免招人妒忌.春节必经的事情可能就是走亲戚了,所以本周特推选取了一个研究亲戚关系的资深 ...

  2. 从log4j切换到logback后项目无法启动

    1.背景 有个旧项目之前使用的是log4j2来打印日志的,因为某些原因,同事想换成logback. 换成logback改动也很简单,大致就一下2步: 删除log4j2.xml配置,新增logback. ...

  3. antDesign 【NG-ZORRO、Angular】日期选择框时间段nz-range-picker设置默认选择日期及限制日期可选范围

    下面的代码包含 1.只可以选择今天以后 2.只可以选择今天开始一周内 3.只能选择今天之前的 import { Component } from '@angular/core'; import dif ...

  4. vulnhub靶场之RIPPER: 1

    准备: 攻击机:虚拟机kali.本机win10. 靶机:Ripper: 1,下载地址:https://download.vulnhub.com/ripper/Ripper.ova,下载后直接vbox打 ...

  5. 重定向Kubernetes pod中的tcpdump输出

    重定向Kubernetes pod中的tcpdump输出 最新发现一个比较有意思的库ksniff,它是一个kubectl 插件,使用tcpdump来远程捕获Kubernetes集群中的pod流量并保存 ...

  6. 初探富文本之CRDT协同算法

    初探富文本之CRDT协同算法 CRDT的英文全称是Conflict-free Replicated Data Type,最初是由协同文本编辑和移动计算而发展的,现在还被用作在线聊天系统.音频分发平台等 ...

  7. C语言中的快排函数——qsort

    函数名 qsort(); 头文件 include<stdlib,h> 功能 对数组内的元素进行默认升序的快速排序 函数声明 void qsort( void *buf, size_t nu ...

  8. 2.3.pages.json文件的页面配置与全局配置

    新建页面 # pages uni-app 通过 pages 节点配置应用由哪些页面组成,pages 节点接收一个数组,数组每个项都是一个对象,其属性值如下: 属性 类型 默认值 描述 path Str ...

  9. Elasticsearch Mapping类型修改

    背景 通常数据库进行分库分表后,目前比较常规的作法,是通过将数据异构到Elasticsearch来提供分页列表查询服务:在创建Elasticsearch索引时,基本都是会参考目前的业务需求.关系数据库 ...

  10. 解决Linux上tomcat解析war包中文文件乱码

    解决Linux上tomcat解析war包中文文件乱码 第一步 编辑tomcat/conf server.xml vim /usr/local/src/tomcat/conf/server.xml us ...