赞
踩
项目测试的时候layer-mobile的open方法
app.$layer.open({
title: app.$t('layer.tishi'),
content:r.msg,
btn:[app.$t('layer.btn')]
})
在ios下没反应,测试一上午终于发现问题所在:
<transition name="fade" mode="out-in" appear>
<router-view class="child-view"></router-view>
</transition>
在.child-view class下我把这行代码注释了,注释的原因是下拉刷新会出问题。只能先加上这个css了
/*当你触摸并按住触摸目标时候,禁止或显示系统默认菜单。 */
touch-action: none;
更新:
晚上测试发现加上这行css后安卓机页面不能滚动了,但是ios是可以滚动的......
唉,只能再注释,然后用css判断是ios机型再加上了
//iphone4 判断ios的代码网上很多,这里就不复制粘贴了
@media (device-height:480px) and (-webkit-min-device-pixel-ratio:2){
.child-view{
/*禁止默认的滚动,当你触摸并按住触摸目标时候,禁止或显示系统默认菜单。 */
touch-action: none;
}
}
......
2019-09-17更新:
去年的项目今年重新做,换了套模板又出现了这个问题。不过这次不是不显示,应该是超出视觉范围了。因为要点两下才能点击其他页面。究其原因是css的影响
vue项目出现弹框整体html布局如下:
child-view主要样式为 position: absolute;元素占满整个屏幕
layui-m-layer源码样式为 position: relative;
android不影响,ios真机调试就是这两个定位的影响导致layer弹框显示在屏幕外了,把layui-m-layer的样式调整为position: absolute!important;同时android不影响,发现可行。
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。