当前位置:网站首页 > React Native移动开发 > 正文

移动端的h5遇到的一些坑记录

一,vw布局下,大屏时,border消失

在750以下的小屏幕时,border 1px solid显示正常,但是大屏幕时,border消失,查看dom发现它其实有渲染,只是单位是px,也就是说没有参与vw的转化。
需要在vw的配置文件中修改参数:
在这里插入图片描述
这样配置之后,1px也会参与vw的转换了。

二,滑动swiper时,如果有下拉刷新,会带动页面滑动

需要stop来阻止事件冒泡。
在这里插入图片描述
具体代码:

<div class="swiper" id="swiper-home-icon" @touchstart.stop="gtouchstart($event)" @touchmove.stop="gtouchmove($event)" @touchend.stop="gtouchend($event)" ></div> 

三,vant的toast组件变形

主要原因是请求接口的时候,先toast.loading,但是接口有报错,又调用了一次toast(“报错信息”),最后才toast.clear()。
在这里插入图片描述
可以看到,toast直接从loading的矩形变成了长方形。
修复方法:虽然我们在页面中调用了toast.loading,但是可以在axios的请求拦截器中先把它clear掉。接下来再报错,就是又生成的一个新的toast实例了,不会受之前旧的影响。

到此这篇移动端的h5遇到的一些坑记录的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章,希望大家都能在编程的领域有一番成就!

版权声明


相关文章:

  • 移动端左右滑动时,屏蔽上下滑动2024-12-02 15:09:06
  • 移动端拉起键盘后遮挡问题2024-12-02 15:09:06
  • 移动端1px问题的解决2024-12-02 15:09:06
  • react-native报错:getPropertyAsObject: property2024-12-02 15:09:06
  • 运行react ntive项目,运行到下载gradle就报错2024-12-02 15:09:06
  • react基础笔记2024-12-02 15:09:06
  • 4.React全家桶及原理解析2024-12-02 15:09:06
  • 3.React组件化22024-12-02 15:09:06
  • 2.React组件化2024-12-02 15:09:06
  • 1.React核心入门2024-12-02 15:09:06
  • 全屏图片