关于vant组件在Android(移动端)中问题总结

1.vant的swipe组件问题

由于公司要做一个全屏轮播切换的效果,并在APP中嵌入使用,在前端使用Vue的前提下,框架选择使用vant,但是在使用vant
的swipe组件过程中,出现一个特殊的情况:
当界面中input获取到焦点并输入值后,APP软键盘弹出,将界面推了上去,但是在收回软键盘之后,被顶上去的界面无法下来,导致后续的轮播界面上升,整个界面布局产生错乱。
解决方案:在经过排查之后发现,是APP端的软键盘占据了空间,导致界面自适应计算了高度,导致高度减少了,针对这种问题,需要在整个界面最大的div框中设置高度,代码如下

<template>
  <div class="light-test" :style="'min-height:' + setDivHeight + 'px' ">
      /*你的代码块*/
  </div>
</template>

<script>
  created(){
      this.setDivHeight = document.body.offsetHeight;
    },

</script>

设置完这个最小高度之后,该问题解决

2.关于vant中部分标签@click不生效问题

在开发过程中,发现部分vant标签@click无法执行对应的函数,经过一系列尝试后发现解决方法:
将@click 写成@click.native即可解决该点击问题

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容