内嵌的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. 今天学到的新知识--使用localtunnel实现内网穿透,感觉很神奇哇~~

    localtunnel 是一个基于 nodejs 的内网穿透工具.通过简单的安装可以实现将内网里的设备的某个端口暴露在公网中以提供服务. 首先你电脑要有node环境 使用本地隧道,对应本地服务的端口号 ...

  2. 使用pycharm打开sqlite的问题

    目录 问题:有同学在sqlite数据库文件执行数据库迁移完成前,点开了他,导致sqlite数据库被pycharm当成文本文件打开了,并且不会改了. 其实sqlite文件和电脑中的其他文件(xx.mp4 ...

  3. nginx微信对接

    location /MP_verify_l47ZUDtvieeDlVWR.txt { default_type text/html; return 200 'l47ZUDtvieeDlVWR'; }

  4. Idea 2022 springboot 3.0 druid: testWhileIdle is true, validationQuery not set

    druid启动错误解决方法: Druid连接池 :严重: testWhileIdle is true, validationQuery not set 增中配置 在 application.yml 增 ...

  5. vivo官网App模块化开发方案-ModularDevTool

    作者:vivo 互联网客户端团队- Wang Zhenyu 本文主要讲述了Android客户端模块化开发的痛点及解决方案,详细讲解了方案的实现思路和具体实现方法. 说明:本工具基于vivo互联网客户端 ...

  6. SpringMVC返回值类型及响应数据类型

    1.SpringMVC 和 Struts2 的优略分析 共同点: 它们都是表现层框架,都是基于 MVC 模型编写的. 它们的底层都离不开原始 ServletAPI. 它们处理请求的机制都是一个核心控制 ...

  7. JS 格式化时间字符串

    // 格式时间字符串 formatDateTimeStr(date, type) { if (date === '' || !date) { return '' } var dateObject = ...

  8. JZOJ 5432. 【NOIP2017提高A组集训10.28】三元组

    题目 有 \(X+Y+Z\) 个三元组 \((x[i],y[i],z[i])\),请你从每个三元组中挑数,并满足以下条件: 1.每个三元组中可以且仅可以选择一个数(即 \(x[i],y[i],z[i] ...

  9. C语言初学习

    首先我们先看一下什么是编译型语言和解释型语言: 解释:借助一个程序,那个程序能试图理解你的程序,然后按照你的要求执行 编译:借助一个程序,就像一个翻译,把你的程序翻译成计算机真正能懂得语言--机器语言 ...

  10. Spring MVC + Webapp 项目显示 404 错误

    这是因为 Tomcat 版本,把 Tomcat10 换成 Tomcat9 就可以解决这个问题了.下面是我正在做的一个 Spring MVC 入门案例,因为 Tomcat 10,DispatcherSe ...