美文网首页
记录一下weex中使用web标签所遇到的问题

记录一下weex中使用web标签所遇到的问题

作者: 键盘之下无新事儿 | 来源:发表于2019-08-18 17:17 被阅读0次

在weex中的使用组件web标签,实际则是webview的应用,只是sdk中只封装了基本方法,下面所列举遇到的问题实则都是webview加载url过程中所遇到的常规问题

1.拍照与选择照片
2.录视频
3.加载第三方url 键盘遮挡输入框

正常使用web标签(实际是在weex中通过webiview封装的组件)加载第三方url,如果发生键盘遮挡输入法的问题,我们基本上可以通过常规方法设置'''android:windowSoftInputMode'''即可解决,但在weex中发现不起作用,也不是因为设置了全屏属性导致的,在和前段调试的过程中发现window的窗口大小没有变化,最终确定是web标签的高度没有变化导致的

<web> 必须指定 width 和 height 的样式属性,否则将不起作用;

使用过程:
weex官方文档中指出必须有宽高,否则web标签不起作用,自然在使用的时候会设置一个指定高度(屏幕高度-状态栏高度-标题栏高度),然后根据web标签属性src指定一个url,页面正常加载显示,只是在页面输入框获得焦点,键盘弹起来,可输入框不会向上滑动,遮挡了...
按常规方法设置之后都不起作用,在和前端联调反馈说键盘弹起时窗口大小没有变化,页面无法向上滑动,输入框被键盘遮挡,进而做了这样的一个处理,
监听键盘的弹起或者收起状态,
默认键盘是收起的,这个时候使用的是web默认时的初始高度((屏幕高度-状态栏高度-标题栏高度)),
当键盘弹起时,则修改web的高度为原始高度+页面变化高度+标题栏高度
再收起时 则还原为初始高度
如此测试发现正常,问题解决
在这个调试过程中发现部分手机会有一片空白,这是因为有些手册有底部虚拟导航按键,这个高度不有计算导致的

4.应用唤醒和下载
5.加载第三方url 重定向返回键无法返回或者连续点击2次返回可返回
6.返回键问题
7.当weex使用web标签加载第3方h5链接JS交互问题

这里主要涉及3个要素:前端页面(vue代码)原生代码(android或者ios)第3方H5页面,其实也就是原生webview在两端的交互实现, 大概交互流程如图所示

工作簿1.png

具体可以参考链接js交互参考

相关文章

  • 记录一下weex中使用web标签所遇到的问题

    在weex中的使用组件web标签,实际则是webview的应用,只是sdk中只封装了基本方法,下面所列举遇到的问题...

  • weex 踩坑记(持续更新中……)

    消失了一个月,努力为新项目倒腾 weex 中,记录一下遇到的问题。之后还会持续更新~ 目前,我使用的 weex 都...

  • Weex爬坑之路

    简单描述一下公司使用weex初衷和记录weex开发中遇到的问题,用作以后回顾; 移动端最大的缺点就是更新版本,整包...

  • web开发中乱码问题的解决

    web开发中乱码问题的解决 由于楼主刚刚接触web不久,自然而然的就遇到了乱码问题。下面就记录一下乱码问题的解决。...

  • weex开发中遇到的问题记录

    JSON.parse()解析JSON字符串并返回对应的值,可以额外传入一个转换函数,用来将生成的值和其属性, 在返...

  • FragmentTabHost使用遇到的问题

    本文记录一下在使用fragmentTabHost的时候所遇到的问题。1:原生的fragmenttabhost在切换...

  • Bootstrap Datatables 基本使用

    在web开发中,经常会遇到使用table用于展示数据。今天就记录一下基于Bootstrap的插件bootstrap...

  • toString方法中遇到的问题

    问题描述 在开发的过程中,遇到toString这个方法,就记录一下使用的过程中遇到的问题。 稍微修改一下 由此可以...

  • vue使用websocket问题记录

    最近笔者新参与的一个web项目,拟定采用vue2.0来编写,期间遇到有关使用websocket的问题,记录一下,个...

  • Weex框架浅析

    1,Weex 是什么? Weex 是使用流行的 Web 开发体验来开发高性能原生应用的框架 ,Weex 致力于使开...

网友评论

      本文标题:记录一下weex中使用web标签所遇到的问题

      本文链接:https://www.haomeiwen.com/subject/opdgjctx.html