app内嵌H5踩坑
内嵌的H5是用的vue2版本开发的,期间有很多的坑要踩:
1、调用app返回上一个页面不触发页面的onmouted和window.onPageShow
app返回上一个页面调用的方法并不会出发vue的页面更新也不触发浏览器的回退事件。
最后使用的是window.history才触发了页面的回退事件
2、唤起软键盘后页面高度变化
因为是内嵌app的H5页面,没有测试机,也未安装虚拟机暂时无法测试
3、因为是内嵌页面,会遇到一个问题就是,底部tab打开的页面相当于浏览器的窗口,同时存在几个窗口,vuex没有触发,但是这个时候又需要几个页面之间进行通信
解决方案是使用local缓存,然后在页面使用watch进行监听,变相的实现了事件触发
app内嵌H5踩坑的更多相关文章
- 移动端开发利器vConsole.js,app内嵌H5开发时调试用
vConsole:一个轻量.可拓展.针对手机网页的前端开发者调试面板,主要还是用于内嵌app页面时在手机上进行调试,打印完全和在PC端一样,方便大家找出问题所在. 不说废话直接进入主题,vConsol ...
- app内嵌H5调用分享
最近产品提出了一个需求:我们在合作方的app中提供的部分页面中增加分享页面,具体要求是在3个二维码推广页面调用app的分享接口,分享方式有3种,分别是点击”分享链接“按钮调起分享,点击”分享图片“按钮 ...
- ios下app内嵌h5页面是video适配问题
ios下做新闻详情用h5页面实现然后打包到app中,其中新闻详情页会有视频,安卓下video的poster可以做到适应video大小,但是ios下会按照poster图片大小将video等比撑大,但是视 ...
- app内嵌H5网页(webviewJavaScriptBridge)
摘要:使用的插件为webviewJavaScriptBridge,app端需要引入一下这个包,html页面只需一段JS代码 与IOS交互 <! 申明交互(此处代码固定) > functio ...
- app内嵌h5分享到小程序分享功能
if (this.GLOBAL.env !== 'production') { try { window.JSBridge.shareMiniProgramToWx('https://www.lexi ...
- app内嵌H5的上传图片的功能
1.上传组件 <!-- - hasBorder {Boolean} cell底部边框,oneline 为 true 有效 - inlineBorder {Boolean} cell底部短边框 - ...
- app内嵌h5页面在ios手机端滑动卡顿的解决方法
1.带滚动条的dom需加样式 -webkit-overflow-scrolling: touch;2.去掉 width:100%; height:100%
- app内嵌 h5页面 再滑动的时候 触发击穿底下的一些touchstart事件
我们的目的是再滑动的时候 不要触发到touchstart事件. // 再滑动的时候无法点开视频 var is_scroll_start,is_scroll_end; $(window).on({ 't ...
- APP内的H5页面测试方法, 移动端的浏览器(例如UC浏览器)测试方法
前言: 用appium做UI自动化,测试APP里面的H5和测试手机浏览器打开的H5的操作流程上是有所区别的.比如要测试APP内嵌的H5需要先操作appium启动APP,然后通过context切到web ...
- APP中内嵌H5页面为什么不能下载?
在APP中内嵌H5页面,若页面上存在下载链接,没有任何反应,为什么呢? 原因是app中内嵌的H5页面是WebView解析的,什么是WebView呢? 在Android手机中内置了一款高性能webkit ...
随机推荐
- 刷题笔记——3003.鸡兔同笼问题 & 2767.计算多项式的值
题目1 3003.鸡兔同笼问题 代码 while True: try: x,y=map(int,input().strip().split()) a = int((4*x-y) / 2) b = x ...
- 一个关于sum over的疑问
参考: http://www.cnblogs.com/lanzi/archive/2010/10/26/1861338.html select * from bitest.tmp_0222_zym ; ...
- MySQL 嵌套子查询 with子句 from子查询 in子查询 join组合
一.适用场景和方法 (1)适用场景 考虑查询过程中是否存在以下情况: 查询某些数据时需要分组才能得到,某些数据不需要分组就能得到或者分组条件不同: 查询某些数据时需要where条件,某些列不需要whe ...
- three.js一步一步来--如何用线画出一个面--网格板子
网格板子~~~ <template> <div style="width:1000px; height:800px"> <p>网格布局</ ...
- 应用容器引擎-Docker
Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的镜像中,然后发布到任何流行的 Linux或Windows操作系统的机器上,也可以实现虚拟化.容器是完全使用沙箱 ...
- Unity之GPS定位(高德解析)
Unity之GPS定位 Unity之GPS定位(高德解析) 前言 开篇 Unity版本及使用插件 正题 创建场景 写脚本 把脚本挂载到场景中 打包发布场景 安装真机并且测试 代码中的==Key==怎么 ...
- petite-vue和Vue的比较
petite-vue不止是变得更小,它还是渐进式增强的最佳实践. Vue不构建或构建都能使用.当通过构建使用时(例如使用单文件组件),Vue预编译所有的模板,所以运行时没有再处理模板.多亏了树摇(th ...
- spring in action day-06 JMS -ActiveMQ Artemi
JMS -ActiveMQ Artemi JMS:它是一个规范,类似于jdbctemplate Spring提供了jmstemplate来发送和接收消息. 搭建JMS环境 1.引入依赖 我们要使用的消 ...
- 精美的web前端源码的特效
1.JS自定义烟花特效 这是一款基于JS和Canvas的自定义烟花特效,初始化界面的时候特效是不带声效的绽放,当你点击顶部中间的播放,即可以看到美丽的烟火也可以听到烟花绽放的声音,让你脑海浮现过年团圆 ...
- P28_全局配置 - 常用的全局配置项以及小程序窗口的组成部分
全局配置文件及常用的配置项 pages 记录当前小程序所有页面的存放路径 window 全局设置小程序窗口的外观 tabBar 设置小程序底部的 tabBar 效果 style 是否启用新版的组件样式 ...