jdf2e / nutui

京东风格的移动端 Vue 组件库,支持多端小程序(A Vue.js UI Toolkit for Mobile Web)
https://nutui.jd.com
MIT License
6.03k stars 818 forks source link

Swiper 轮播 在手机模式下 @click事件失效,电脑模式下可以 #3124

Closed onetalkchen closed 2 weeks ago

onetalkchen commented 3 weeks ago

NutUI 包名

@nutui/nutui, @nutui/nutui-taro

NutUI 版本号

4.3.8

平台

h5, weapp

重现链接

https://nutui.jd.com/playground/#eyJBcHAudnVlIjoiPHRlbXBsYXRlPlxuICA8bnV0LXN3aXBlclxuICAgIDppbml0LXBhZ2U9XCIyXCJcbiAgICA6YXV0by1wbGF5PVwiMzAwMFwiXG4gICAgcGFnaW5hdGlvbi12aXNpYmxlXG4gICAgcGFnaW5hdGlvbi1jb2xvcj1cIiM0MjY1NDNcIlxuICAgIHBhZ2luYXRpb24tdW5zZWxlY3RlZC1jb2xvcj1cIiM4MDgwODBcIlxuICA+XG4gICAgPG51dC1zd2lwZXItaXRlbSB2LWZvcj1cIihpdGVtLCBpbmRleCkgaW4gbGlzdFwiIDprZXk9XCJpbmRleFwiIHN0eWxlPVwiaGVpZ2h0OiAxNTBweFwiPlxuICAgICAgPGltZyA6c3JjPVwiaXRlbVwiIGFsdD1cIlwiIHN0eWxlPVwiaGVpZ2h0OiAxMDAlOyB3aWR0aDogMTAwJVwiIGRyYWdnYWJsZT1cImZhbHNlXCIgQGNsaWNrPVwidGVzdFwiLz5cbiAgICA8L251dC1zd2lwZXItaXRlbT5cbiAgPC9udXQtc3dpcGVyPlxuPC90ZW1wbGF0ZT5cbjxzY3JpcHQgc2V0dXA+XG5pbXBvcnQgeyByZWYgfSBmcm9tICd2dWUnXG5jb25zdCB0ZXN0PSgpPT57XG4gIGFsZXJ0KFwi57uR5a6aXCIpXG59XG5jb25zdCBsaXN0ID0gcmVmKFtcbiAgJ2h0dHBzOi8vc3RvcmFnZS4zNjBidXlpbWcuY29tL2pkYy1hcnRpY2xlL051dFVJdGFybzM0LmpwZycsXG4gICdodHRwczovL3N0b3JhZ2UuMzYwYnV5aW1nLmNvbS9qZGMtYXJ0aWNsZS9OdXRVSXRhcm8yLmpwZycsXG4gICdodHRwczovL3N0b3JhZ2UuMzYwYnV5aW1nLmNvbS9qZGMtYXJ0aWNsZS93ZWxjb21lbnV0dWkuanBnJyxcbiAgJ2h0dHBzOi8vc3RvcmFnZS4zNjBidXlpbWcuY29tL2pkYy1hcnRpY2xlL2ZyaXN0ZmFidS5qcGcnXG5dKVxuPC9zY3JpcHQ+XG4ifQ==

重现步骤

image

期望的结果是什么?

手机模式下也能触发click事件

实际的结果是什么?

手机模式下无法触发click事件

环境信息

自己搭建的vue环境,和在官方的示例里面修改。

其他补充信息

No response

daiwanxing commented 3 weeks ago

手机模式指的是小程序平台吗?是具体哪个平台的小程序?

我这边试了在编译到微信小程序并给 <nut-swiper-item /> 绑定 click 事件是可以正常响应的。另外你的重现链接里在点击的事件的回调函数中用到了 alert 这个在小程序平台是会报错的。

onetalkchen commented 2 weeks ago

手机模式指的是小程序平台吗?是具体哪个平台的小程序?

我这边试了在编译到微信小程序并给 <nut-swiper-item /> 绑定 click 事件是可以正常响应的。另外你的重现链接里在点击的事件的回调函数中用到了 alert 这个在小程序平台是会报错的。

就是普通网页,手机模式下click 事件丢失。直接在浏览器模f12拟手机模式,就会复现。

daiwanxing commented 2 weeks ago

手机模式指的是小程序平台吗?是具体哪个平台的小程序? 我这边试了在编译到微信小程序并给 <nut-swiper-item /> 绑定 click 事件是可以正常响应的。另外你的重现链接里在点击的事件的回调函数中用到了 alert 这个在小程序平台是会报错的。

就是普通网页,手机模式下click 事件丢失。直接在浏览器模f12拟手机模式,就会复现。

nut-swiper 设置 isPreventDefault: false

<nut-swiper :isPreventDefault="false" />
onetalkchen commented 2 weeks ago

可以了,感觉