mand-mobile 的 swiper 在 Android 无法响应点击事件

didi / mand-mobile

💰 A mobile UI toolkit, based on Vue.js 2, designed for financial scenarios.

https://didi.github.io/mand-mobile

Apache License 2.0

3.46k stars 772 forks source link

mand-mobile 的 swiper 在 Android 无法响应点击事件 #121

Closed PLQin closed 6 years ago

PLQin commented 6 years ago

OS Version & Browser Version

全Android系统, 微信浏览器6.6.0

Node Version, Package Management Tool

"mand-mobile": "^1.3.0",

Recurring Links

http://10.7.112.183:8082/#/?channelId=LKL_CLOUD_POS

Recurring Steps

点击顶部 banner

Expectant Behaviors

会前往新的页面

Actual Behaviors

Android机型下没有反应, 随机点击banner底部某一小块区域可能会触发

xxyan0205 commented 6 years ago

试一下下面这个例子，点击能否跳转

PLQin commented 6 years ago

@xxyan0205 好的, 稍等, 有国内的吗, 手机访问codesandbox有点慢

PLQin commented 6 years ago

Lakala-CreditCard-Wx.zip

手机和pc一直是 transpiling modules; 上面是我的测试包, 能否帮我看下, 我有注意你的demo写了@click.native, 但是我也一直是这样使用的, 没有效果; npm start 后访问: localhost:8080/#/?channelId=LKL_CLOUD_POS

xxyan0205 commented 6 years ago

is-prevent是否设置为false

PLQin commented 6 years ago

@xxyan0205 果然是这个问题 , /赞但是为什么is-prevent 未设置为 false 时, 在ios系统中, 可以被点击, 在pc开发者工具模拟时可以被点击, 甚至于在Android底部某一块随机点击时也能触发

xxyan0205 commented 6 years ago

is-prevent为true时，swiper区域的touch事件和mouse的一系列事件都被event.preventDefault()，理论上是不能响应点击事件的。

PLQin commented 6 years ago

目前官方文档的说明是:

is-prevent	是否阻止默认的事件，如页面滚动事件	Boolean	true	true, false

个人认为这是不规范的, 可以更新官方文档, 或者更新代码, 过滤掉用户绑定的点击事件